我正在使用 Expo 和 react-navigation 構建一個 react-native 應用程式，該應用程式目前有兩個導航器，一個對經過身份驗證的用戶可見，一個只對未經身份驗證的用戶可見，例如登錄頁面。
這是導航結構：
function Navigation({ isLoggedIn }) {
return (
<NavigationContainer>
{isLoggedIn ? (
<Stack.Navigator>
<Stack.Screen name="home" component={Home}></Stack.Screen>
<Stack.Screen name="public" component={Public}></Stack.Screen>
</Stack.Navigator>
) : (
<Stack.Navigator>
<Stack.Screen name="login" component={Login}></Stack.Screen>
<Stack.Screen name="public" component={Public}></Stack.Screen>
</Stack.Navigator>
)}
</NavigationContainer>
);
}
如您所見，有一個名為“public”的螢屏在兩個導航器中出現兩次，因為我希望人們無論身份驗證狀態如何都能夠查看此組件，這是正確的方法嗎？
uj5u.com熱心網友回復：
isLoggedIn您可以做的是啟動一個 Stack Navigator，然后根據isLoggedIn狀態放置螢屏，而不是根據狀態啟動兩個單獨的 Stack Navigator 。像下面這樣
<NavigationContainer>
<Stack.Navigator>
{isLoggedIn ? (
<Stack.Screen name="home" component={Home}></Stack.Screen>
) : (
<Stack.Screen name="login" component={Login}></Stack.Screen>
)}
<Stack.Screen name="public" component={Public}></Stack.Screen>
</Stack.Navigator>
</NavigationContainer>
通過這種方式，您不必將“公共”螢屏放置兩次，但用戶無論其身份驗證狀態如何都可以看到該螢屏。此外，您不必兩次啟動 StackNavigator。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/401028.html