这是我的父导航器 .
AppNavigator.js
const AppNavigator = StackNavigator(
{
SplashScreen: { screen:SplashScreen },
Login: { screen:Login },
ForgotPassword: { screen:ForgotPassword },
RoleOneApp: { screen: RoleOneApp },
RoleTwoApp: { screen: RoleTwoApp },
},
{
headerMode: 'none',
},
);
这已在App.js中用作
<AppNavigator navigation={addNavigationHelpers({ dispatch, state: navState })}/>
SplashScreen,Login,ForgotPassword是React原生屏幕 .
而RoleOneApp和RoleTwoApp是带有 nested stack navigator. 的屏幕,而目标是,当应用程序启动时,Splashscreen会打开,假设用户已登录;根据用户角色(使用AsyncStorage存储),我们将用户导航到'RoleOneApp'或'RoleTwoApp'
RoleOneApp.js
import RoleOneAppNavigator from './RoleOneAppNavigator';
class RoleOneApp extends React.PureComponent {
static router = RoleOneAppNavigator.router;
render() {
return (<RoleOneAppNavigator navigation={this.props.navigation}/>);
}
}
export default RoleOneApp;
RoleOneAppNavigator.js
const RoleOneAppNavigator = StackNavigator(
{
roleoneScreen1: {
screen: SomeScreen1,
},
roleoneScreen2: {
screen: SomeScreen2,
},
roleoneScreen3: {
screen: SomeScreen3,
},
},
{
headerMode: 'none',
navigationOptions: {
gesturesEnabled: false,
},
},
);
RoleTwoApp.js
class RoleTwoApp extends React.PureComponent {
static router = RoleTwoAppNavigator.router;
render() {
return (<RoleTwoAppNavigator navigation={this.props.navigation}/>);
}
}
export default RoleTwoApp;
RoleTwoAppNavigator.js
const RoleTwoAppNavigator = StackNavigator(
{
roleTwoScreen1: {
screen: TechScreen1,
},
roleTwoScreen2: {
screen: TechScreen2,
},
roleTwoScreen3: {
screen: TechScreen3,
},
},
{
headerMode: 'none',
navigationOptions: {
gesturesEnabled: false,
},
},
);
现在让我们说这发生了
应用程序启动 - >现在用户处于启动画面 . SplashScreen:在启动画面中我们做了replaceRoute('RoleOneApp')RoleOneApp(屏幕:SomeScreen1)
现在的问题是,如何从这里导航到Login,ForgotPassword屏幕 . 如果我尝试导航我遇到错误,请使用RoleOneAppNavigator中的一个路由 .
“react”:“16.0.0-alpha.12”,“react-navigation”:“1.0.0-beta.15”,“react-redux”:“5.0.5”,“redux”:“3.6 . 0" ,