不变违规：此导航器缺少导航道具。在 react-navigation 3 中，您必须直接设置您的应用容器答案

【问题标题】：Invariant Violation: The navigation prop is missing for this navigator. In react-navigation 3 you must set up your app container directly不变违规：此导航器缺少导航道具。在 react-navigation 3 中，您必须直接设置您的应用容器
【发布时间】：2019-05-23 09:55:36
【问题描述】：

我正在尝试使用最新的 react-navigation 版本运行我的应用程序，但无法正常工作。也尝试使用此解决方案 (Invariant Violation: The navigation prop is missing for this navigator) 但没有解决方案。

错误信息

Invariant Violation: The navigation prop is missing for this navigator. In react-navigation 3 you must set up your app container directly. More info: https://reactnavigation.org/docs/en/app-containers.html

我的代码

App.js

import App from './app/index';
export default App;

index.js

import React from "react";
import { StyleSheet, Text, View } from "react-native";

import { SignedOut } from "./router";

export default class App extends React.Component {
  render() {
    return <SignedOut />;
  }
}

路由器.js

import { createStackNavigator, createAppContainer } from "react-navigation";

import SignUp from "./screens/SignUp";
import SignIn from "./screens/SignIn";

export const SignedOut = createStackNavigator({
  SignUp: {
    screen: SignUp,
    navigationOptions: {
      title: "Sign Up"
    }
  },
  SignIn: {
    screen: SignIn,
    navigationOptions: {
      title: "Sign In"
    }
  }
});

参考：https://github.com/datomnurdin/auth-reactnative

【问题讨论】：

标签： javascript reactjs react-native

【解决方案1】：

在 react-navigation v3 中，您需要手动添加 App Container，如下面的链接所述 https://reactnavigation.org/docs/en/app-containers.html

【讨论】：

【解决方案2】：

在react-navigation 的早期版本中，App 容器由 create*Navigation 方法提供。

在react-navigation v3中，您需要手动添加应用容器，如here所述

import { createStackNavigator, createAppContainer } from "react-navigation";

const SignedOutNavigator = createStackNavigator({
  SignUp: {
    screen: SignUp,
    navigationOptions: {
      title: "Sign Up"
    }
  },
  SignIn: {
    screen: SignIn,
    navigationOptions: {
      title: "Sign In"
    }
  }
});

export const SignedOut = createAppContainer(SignedOutNavigator); // Use this

【讨论】：