react-navigation v5(下一个):从不同父级的子级屏幕导航到嵌套的子级屏幕

时间:2019-12-11 23:00:09

标签: react-native react-navigation

使用react-navigation v5(下一个):

高级问题:从其他父级的子级屏幕导航到嵌套的子级屏幕。

这是我的根导航器

export const AppNavigator = (props): React.ReactElement => (
   <Stack.Navigator {...props} headerMode='none' mode={'modal'}>
      <Stack.Screen name={AppRoute.AUTH} component={AuthNavigator} />
      <Stack.Screen name={AppRoute.HOME} component={HomeNavigator} />
   </Stack.Navigator>
);

这是我的AuthNavigator:

export const AuthNavigator = (): React.ReactElement => (
   <Stack.Navigator headerMode='none'>
      <Stack.Screen name={AppRoute.SIGN_IN} component={SignInScreen} />
      <Stack.Screen name={AppRoute.LOG_OUT} component={LogOutScreen} />
      <Stack.Screen name={AppRoute.SIGN_UP} component={SignUpScreen} />
      <Stack.Screen
         name={AppRoute.RESET_PASSWORD}
         component={ResetPasswordScreen}
      />
   </Stack.Navigator>
);

我要从HomeNavigator的页面中直接导航到LogOutScreen / AppRoute.LOG_OUT

我可以打电话给navigate(AppRoute.AUTH),但是如果我打电话给navigate(AppRoute.LOG_OUT)则没有任何效果。

1 个答案:

答案 0 :(得分:1)

类似的事情应该起作用:

// Navigate to 'AppRoute.LOG_OUT' inside 'AppRoute.AUTH'
navigation.navigate(AppRoute.AUTH, { screen: AppRoute.LOG_OUT });

https://reactnavigation.org/docs/en/next/nesting-navigators.html#navigating-to-a-screen-in-a-nested-navigator