永久违反:此导航器缺少导航道具。在反应导航3中

时间:2018-11-19 17:34:43

标签: reactjs react-native react-navigation

我是本机反应的新手,我正在尝试使用堆栈导航创建一个应用程序。这就是我在App.js上拥有的东西

import React from "react";
import { View, Text } from "react-native";
// Import React Navigation
import { createStackNavigator, createAppContainer } from 'react-navigation'

// Import the screens
import Main from './components/Main';
import Chat from './components/Chat';



// Create the navigator
const navigator = createStackNavigator({
  Main: { screen: Main },
  Chat: { screen: Chat },
});
const App = createAppContainer(navigator)


export default 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

This error is located at:
    in Navigator (at createKeyboardAwareNavigator.js:12)
    in KeyboardAwareNavigator (at registerRootComponent.js:17)
    in RootErrorBoundary (at registerRootComponent.js:16)
    in ExpoRootComponent (at renderApplication.js:34)
    in RCTView (at View.js:44)
    in RCTView (at View.js:44)
    in AppContainer (at renderApplication.js:33)
- node_modules/@react-navigation/core/src/navigators/createNavigator.js:19:8 in getDerivedStateFromProps
- node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js:7663:46 in applyDerivedStateFromProps
- ... 20 more stack frames from framework internals

我显然做错了,请协助

2 个答案:

答案 0 :(得分:3)

official documentationReact Navigation

  

注意:在v2和更早版本中,React Navigation中的容器由create * Navigator函数自动提供。从v3开始,您需要直接使用容器。在v3中,我们还将createNavigationContainer重命名为createAppContainer。

这意味着,现在您必须显式使用在代码中完成的容器。

但是您仍在使用(导出)navigator,而不是App

因此,将最后一行更改为

export default App

答案 1 :(得分:0)

请遵循以下步骤:

  1. 在package.json天气中检查您的反应导航版本(如果最新) 或您最初创建项目时使用的对象。
  2. 如果您删除了较旧的版本并使用了npm命令,则说明已安装 react-native版本的最新版本可能是无法在其中找到文件 库。
  3. 最后删除节点模块并检查您的旧项目,它是 react-navigation版本,并使其在当前项目中相同 package.json
  4. 运行npm install命令

立即运行项目。