我们如何在基于类的组件中将导航 4 的切换导航器替换为导航 5（不使用 redux）？答案

【问题标题】：How can we replace switch navigator of navigation 4 to navigation 5 in class based components (without using redux)?我们如何在基于类的组件中将导航 4 的切换导航器替换为导航 5（不使用 redux）？
【发布时间】：2023-03-19 06:55:01
【问题描述】：

假设我们有一个启动屏幕，我们检查用户是否登录。如果已登录，则导航到商店屏幕，否则导航到身份验证屏幕。我的问题是如何将导航 4 的切换导航器替换为导航 5，其中我们有启动屏幕、身份验证屏幕和商店屏幕？请举例说明

谢谢大家。请帮忙

【问题讨论】：

标签： react-native react-native-android react-native-navigation

【解决方案1】：

react-navigation v5 已将其可用性转换为 Component base，并且没有这种 SwitchNavigator 功能可用。

我们可以使用 react-navigation v5 作为组件渲染来声明我们的屏幕并创建我们的导航器。

由于我们能够在组件渲染中使用条件，因此我们可以将条件放入导航器渲染中以检查用户是否登录，如果是，则显示 MainApp 导航，否则显示 AuthNavigation。

例如

isSignedIn ? (
 <>
    <Stack.Screen name="Home" component={HomeScreen} />
    <Stack.Screen name="Profile" component={ProfileScreen} />
    <Stack.Screen name="Settings" component={SettingsScreen} />
 </>
) : (
 <>
    <Stack.Screen name="SignIn" component={SignInScreen} />
    <Stack.Screen name="SignUp" component={SignUpScreen} />
 </>
)

欲了解更多信息，请查看官方文档： https://reactnavigation.org/docs/auth-flow

【讨论】：