react-navigation v5（下一个）：从其他父级的子级屏幕导航到嵌套子级屏幕

Question

使用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)，则没有任何效果。

Answer 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