reactjs - 不变违规:此导航器缺少导航道具
问题描述
当我尝试启动我的 react native 应用程序时收到此消息。通常这种格式适用于其他多屏幕导航,但在这种情况下不知何故不起作用。
这是错误:
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
这是我的应用程序格式:
import React, {Component} from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { createStackNavigator } from 'react-navigation';
import Login from './view/login.js'
import SignUp from './view/signup.js'
const RootStack = createStackNavigator(
{
Home: {
screen: Login
},
Signup: {
screen: SignUp
}
},
{
initialRouteName: 'Home'
}
);
export default class App extends React.Component {
render() {
return <RootStack />;
}
}
解决方案
React Navigation 3.0 有许多重大更改,包括根导航器所需的显式应用程序容器。
过去,任何导航器都可以充当应用程序顶层的导航容器,因为它们都被包装在“导航容器”中。导航容器,现在称为应用容器,是一个高阶组件,它维护应用的导航状态并处理与外部世界的交互以将链接事件转化为导航操作等。
在 v2 及更早版本中,React Navigation 中的容器由 create*Navigator 函数自动提供。从 v3 开始,您需要直接使用容器。在 v3 中,我们还将 createNavigationContainer 重命名为 createAppContainer。
另请注意,如果您现在使用的是 v4,则导航器已移至单独的存储库。您现在需要安装并从'react-navigation-stack'
. 例如import { createStackNavigator } from 'react-navigation-stack'
以下解决方案适用于 v3。
import {
createStackNavigator,
createAppContainer
} from 'react-navigation';
const MainNavigator = createStackNavigator({...});
const App = createAppContainer(MainNavigator);
更全面的代码示例:
import {
createStackNavigator,
createAppContainer
} from 'react-navigation';
import Login from './view/login.js'
import SignUp from './view/signup.js'
const RootStack = createStackNavigator({
Home: {
screen: Login
},
Signup: {
screen: SignUp
}
});
const App = createAppContainer(RootStack);
export default App;
推荐阅读
- java - 前向标头变量 Spring Boot
- php - html表中的数量选择以将每行保存到mysql数据库
- c# - 在运行时从属性中删除所需的属性
- python-3.x - 如何在 pandas 中为 describe() 添加属性?
- android-studio - 我使用 google Drive api 面临两个问题:套接字超时异常和用户限制超出
- python-3.x - 我无法从 PyQt5 标签类中获取文本数据。它只返回小部件数组的最后一个
- android - 我不小心在 Android Studio 中将 Java 文件转换为 Kotlin 文件。如何转换回来?
- c# - c# - AspNetCore 设置内容根路径
- python - 使用 Setuptools 清空目录
- matlab - MATLAB 的 full() 函数对行参数有什么作用?