Вопрос:

Как сделать сброс в другой стек с помощью реакции-навигации

react-native react-navigation

2 просмотра

1 ответ

1218 Репутация автора

Мы используем реагирующую навигацию в качестве стандартной навигационной системы в нашем собственном приложении реакции, которое в настоящее время имеет несколько стеков. Мы хотели бы перейти от экрана в одном стеке к экрану в другом стеке. Это базовый пример различных стеков:

const StackNavigator = createStackNavigator({
  SplashScreen: connectToStore(SplashScreen),
},{
  initialRouteName: 'SplashScreen',
  mode: 'card'
})

const ModalNavigator = createStackNavigator({
  LoginScreen: connectToStore(LoginScreen),
})

const AppNavigator = createStackNavigator({
  StackNavigator: StackNavigator,
  ModalNavigator: ModalNavigator,
}, {
  initialRouteName: 'StackNavigator',
  headerMode: 'none',
  mode: 'modal'
})

Проблема в том, если мы попытаемся сбросить на новый экран, например, так:

const resetAction = StackActions.reset({
  index: 0,
  key: null,
  actions: [
    NavigationActions.navigate({
      routeName: 'LoginScreen',
    })
  ]
});
this.props.navigation.dispatch(resetAction);

Мы получаем ошибку, которая говорит что-то вроде этого:

ExceptionsManager.js: 74 Ошибка: для ключа DashboardScreen не определен маршрут. Должно быть одним из: 'StackNavigator', 'ModalNavigator'

Автор: Asleepace Источник Размещён: 14.08.2019 01:58

Ответы (1)


0 плюса

1218 Репутация автора

Так как этот вопрос не кажется хорошо задокументированным или ответил на другие вопросы здесь, это

const resetAction = StackActions.reset({
  index: 0,
  key: null,
  actions: [
    NavigationActions.navigate({
      routeName: 'ModalNavigator',
      action: NavigationActions.navigate({
        routeName:'LoginScreen', 
        params:{}
      })
    })
  ]
});
this.props.navigation.dispatch(resetAction);

Во- первых , мы должны указать правильный стек , который мы хотим resetToв этом случае , ModalNavigatorа затем добавить суб-акцию , где мы можем указать , что экран навигатора есть LoginScreen.

И просто для дальнейшего использования, чтобы всплыть или вернуться, мы можем использовать

this.props.navigation.dispatch(StackActions.pop({ n:1 }));

где n - количество всплывающих окон или просто весь путь:

this.props.navigation.dispatch(StackActions.popToTop());
Автор: Asleepace Размещён: 14.08.2019 01:58
Вопросы из категории :
32x32