3
votes

comment revenir en arrière d'une page dans React Native Navigation v3

J'utilise le modèle d'onglets sur expo react native.

J'ai une navigation dans AppNavigator.js

<Left>
                    <Button hasText transparent onPress={() => {
                        this.props.navigation.goBack(null);
                    }} >
                        <Text>Cancel</Text>
                    </Button>
                </Left>

Lorsque je tape sur l'objectif, j'arrive à cette page très bien. mais à l'intérieur de l'écran d'objectif, je veux revenir en arrière lorsque j'appuie sur le bouton de retour.

import React from 'react';
import { createAppContainer, createSwitchNavigator, createStackNavigator } from 'react-navigation';

import MainTabNavigator from './MainTabNavigator';
import GoalScreen from '../screens/GoalScreen';

const GoalStack = createStackNavigator({
  Goal: GoalScreen
})

export default createAppContainer(createSwitchNavigator({
  // You could add another route here for authentication.
  // Read more at https://reactnavigation.org/docs/en/auth-flow.html
  Main: MainTabNavigator,
  Goal: GoalStack
}));

Mais pour une raison quelconque, cela ne fonctionne pas.

react-native react-navigation

0 commentaires

3 Réponses :

2
votes

Dans Changer de navigateur, vous devez changer de navigation directement,

Par exemple:

this.props.navigation.navigate("Main");

Et si vous passez d'un écran à un autre (dans la navigation dans la pile), vous pouvez utiliser la fonction 'goBack'.

0 commentaires

1
votes

Cela fonctionne correctement Il n'y a pas de pile précédente à revenir.

Le but de SwitchNavigator est d'afficher un seul écran à la fois. Par défaut, il ne gère pas les actions de retour et réinitialise les routes à leur état par défaut lorsque vous vous éloignez

https://reactnavigation.org/docs/en/switch-navigator.html

Vous pouvez effectuer une action goback dans GoalStack si vous avez plus d'un écran. Mais le GoalStack et MainTabNavigator sont spécifiés dans le navigateur de commutateur. Puisque le navigateur de commutation affiche un écran à la fois, vous ne pouvez pas effectuer de goback ici.

si vous souhaitez utiliser MainTabNavigator de GoalStack, vous devez utiliser comme ci-dessous

this.props.navigation.navigate ("Main")

2 commentaires

Comment ajouter une pile de navigation? Je veux conserver une histoire

Vous pouvez changer le SwitchNavigator en StackNavigator alors vous seul pouvez conserver un historique

1
votes

Essayez ceci:

this.props.navigation.goBack();

0 commentaires