как вернуться на страницу в реагировать родной навигации v3

Question

Я использую шаблон вкладок на expo реагировать на родной.

У меня есть навигация в AppNavigator.js

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

Когда я нажимаю на Цель, я хорошо попадаю на эту страницу. но на экране цели я хочу вернуться, когда нажимаю кнопку «назад».

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

Но по какой-то причине не работает.

Answer 1

Работает правильно. Нет предыдущего стека для возврата.

Цель SwitchNavigator - показывать только один экран за раз. По умолчанию он не обрабатывает обратные действия и сбрасывает маршруты в состояние по умолчанию при переключении

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

Вы можете выполнить действие возврата в GoalStack, если у вас более одного экрана. Но и GoalStack, и MainTabNavigator указываются в навигаторе коммутатора. Так как переключатель навигатор показывает один экран за раз, вы не можете выполнить возврат здесь.

если вы хотите перейти на MainTabNavigator из GoalStack, вам нужно использовать, как показано ниже

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

Answer 2

В переключателе навигатора вы должны переключать навигацию напрямую,

Например:

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

И если вы нажимаете от одного экрана к другому экрану (В стековой навигации) вы можете использовать функцию «goBack».

Answer 3

Попробуйте это:

this.props.navigation.goBack();