React Native InitialRouteName

Question

我正在使用React Native v5.0，并试图为我的应用程序设置嵌套导航，然而，道具"initialRouteName"似乎不起作用，即使我在没有任何React Redux代码或嵌套函数的情况下单独设置它，它仍然无法工作，这个道具应该如何工作？

import { useSelector } from 'react-redux';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import SignIn from './pages/SigIn';
import SignUp from './pages/SignUp';
import Dashboard from './pages/Dashboard';
const AppStack = createStackNavigator();
const Tab = createBottomTabNavigator();
function Home() {
return (
<Tab.Navigator>
<Tab.Screen name="Dashboard" component={Dashboard} />
</Tab.Navigator>
);
}
export default function Routes() {
const Signed = useSelector((state) => state.auth.signed);
return (
<NavigationContainer>
<AppStack.Navigator
initial={Home}
initialRouteName={Signed ? Home : SignIn}
screenOptions={{ headerShown: false }}
>
<AppStack.Screen name="SignIn" component={SignIn} />
<AppStack.Screen name="SignUp" component={SignUp} />
<AppStack.Screen name="Home" component={Home} />
</AppStack.Navigator>
</NavigationContainer>
);
}```

Answer 1

您忘记了字符串

---

initialRouteName={Signed ? "Home" : "SignIn"}

Answer 2

根据文档，我们不应该将授权屏幕和非授权屏幕放在一个堆栈中。这就是所谓的"；"受保护的路线"；。每个堆栈可以有自己的initialRouteNamehttps://reactnavigation.org/docs/5.x/auth-flow

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} />
</>
)