是否有一种方法在屏幕之间导航，而不是在ReactNavigation中的NavigationContainer中定义的?

Question

我试图导航到我的登录屏幕，但我还没有在我的NavigationContainer中定义我的登录屏幕。这是因为我不想让登录屏幕成为导航栏中的一个选项卡。这就引出了我的问题:有没有一种方法可以导航到登录屏幕，而不把它作为导航栏中的选项卡?

export default function App() {
return (
<NavigationContainer>
<SafeAreaView style={{flex: 1}}>
<Tab.Navigator
screenOptions={({ route }) => ({
tabBarIcon: ({ focused, color, size }) => {
let iconName;
if (route.name === 'Home') {
iconName = focused
? 'home-outline'
: 'home-outline';
} else if (route.name === 'Profile') {
iconName = focused ? 'person-circle-outline' : 'person-circle-outline';
} else if (route.name === 'Calendar') {
iconName = focused ? 'calendar-clear' : 'calendar-clear';
} else if (route.name === 'Agenda') {
iconName = focused ? 'calendar-outline' : 'calendar-outline';
}
return <Ionicons name={iconName} size={size} color={color} />;
},
})}
tabBarOptions={{
activeTintColor: 'blue',
inactiveTintColor: 'gray',
}}
>
<Tab.Screen name="Home" component={HomeScreen} />
<Tab.Screen name="Profile" component={ProfileScreen} />
<Tab.Screen name="Calendar" component={CalendarScreen} />
<Tab.Screen name="Agenda" component={AgendaScreen} />
<Tab.Screen name="New Event" component={NewEventScreen} />
</Tab.Navigator>
</SafeAreaView>
</NavigationContainer>
);
}

<Button 
title="Do you have an account? Click here to log in"
onPress={() => this.props.navigation.navigate("Login")}
/>

Answer 1

这是如何做到这一点的一个例子:

private render() {
const Stack = createStackNavigator();
const landingScreen = this.props.isLoggedIn ? null : (
<Stack.Screen
name="LoginScreen"
component={LoginScreen}
/>
);

return (
<NavigationContainer>
<Stack.Navigator>
{landingScreen}
<Stack.Screen name="HomeScreen" component={this.renderTabNavigator}/>
</Stack.Navigator>
</NavigationContainer>
);
}
private renderTabNavigator = () => {
const Tab = createBottomTabNavigator();
return (
<Tab.Navigator>
<Tab.Screen name="Home" component={SearchScreen}/>
<Tab.Screen name="Favorites" component={FavoritesScreen}/>
<Tab.Screen name="Settings" component={SettingsScreen}/>
</Tab.Navigator>
);
}