当我尝试启动我的 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 有多个 breaking changes包括根导航器所需的显式应用程序容器。
In the past, any navigator could act as the navigation container at the top-level of your app because they were all wrapped in “navigation containers”. The navigation container, now known as an app container, is a higher-order-component that maintains the navigation state of your app and handles interacting with the outside world to turn linking events into navigation actions and so on.
In v2 and earlier, the containers in React Navigation are automatically provided by the create*Navigator functions. As of v3, you are required to use the container directly. In v3 we also renamed createNavigationContainer to 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;