【问题标题】:Invariant Violation: The navigation prop is missing for this navigator. In react-navigation 3不变违规:此导航器缺少导航道具。在反应导航 3
【发布时间】:2019-04-22 02:59:24
【问题描述】:

我是本机反应的新手,我正在尝试创建一个带有堆栈导航的应用程序。这就是我的 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

我明显做错了,请帮忙

【问题讨论】:

标签: reactjs react-native react-navigation


【解决方案1】:

React Navigationofficial documentation

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

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

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

所以,把你的最后一行改成

export default App

【讨论】:

    【解决方案2】:

    按照以下步骤操作:

    1. 检查你在 package.json 天气中的 react-navigation 版本是否是最新的 或最初创建项目时的相同。
    2. 如果您删除了旧版本并使用了 npm 命令,则它已安装 react-native 最新版本可能是它无法在其中找到文件 图书馆。
    3. 最后删除节点模块并检查您的旧项目,它是 react-navigation 版本并在当前项目里面做一样 包.json
    4. 运行 npm install 命令

    现在运行项目。

    【讨论】:

      猜你喜欢
      • 2020-05-29
      • 2019-04-21
      • 1970-01-01
      • 2019-08-27
      • 1970-01-01
      • 2021-08-29
      • 1970-01-01
      • 2019-09-11
      • 2019-12-08
      相关资源
      最近更新 更多