Bonjour les gars, j'ai 5 conteneurs dans ma barre d'onglets et j'aimerais savoir s'il y a une option pour revenir à l'écran principal si je sélectionne un autre conteneur d'onglets.
J'ai donc ce qui suit
https://snack.expo.io/@react -navigation / stacks-in-tabs-v3
Pendant que je suis dans l'onglet Accueil , je clique sur Aller aux détails puis je passe à l'onglet Paramètres . Si je retourne au conteneur Home , je veux voir l'écran par défaut qui est HomeScreen
Une option?
3 Réponses :
Parce que votre DetailScreen est imbriqué dans la pile Accueil , vous devez naviguer d'un niveau de plus vers cet écran
_navigateHome = () => {
const navigateAction = NavigationActions.navigate({
routeName: 'Home',
action: NavigationActions.navigate({ routeName: 'Home' }),
});
this.props.navigation.dispatch(navigateAction);
}
Alors, où dois-je appeler _navigateHome ?
lorsque vous appuyez sur le bouton Accueil dans SettingsScreen
eh bien mon idée n'était pas de partir de là mais d'onglets. Ainsi, dans l'onglet Accueil , je suis dans l'écran Détails , je passe à l'onglet Paramètres à partir de la barre d'onglets et à partir de là, je sélectionne Accueil code> onglet de la barre d'onglets
Vous pouvez redéfinir le tabBarOnPress des navigationOptions de chaque StackNavigator comme ceci:
const stacks = [
{ Home: HomeScreen, Details: DetailsScreen },
{ Settings: SettingsScreen, Details: DetailsScreen }
].reduce((stacksObj, stack) => {
const initialRoute = Object.keys(stack)[0];
stacksObj[initialRoute] = createStackNavigator(
stack,
{
navigationOptions: {
tabBarOnPress: ({ navigation }) => navigation.navigate({
routeName: initialRoute,
action: navigation.popToTop()
})
}
}
);
return stacksObj
}, {});
export default createAppContainer(createBottomTabNavigator(
stacks,
{ /* same defaultNavigationOptions as the snack example */ }
));
Il semble que l'API a changé, la nouvelle façon d'y parvenir est:
import { CommonActions } from '@react-navigation/native';
navigation.dispatch(
CommonActions.navigate({
name: 'Profile',
params: {
user: 'jane',
},
})
);