Предотвратить размонтирование при переходе с экрана B на A

Question

Итак, моя проблема: при использовании React Navigation, когда пользователь переходит на экран A, A монтируется.Когда пользователь переходит к экрану B, B подключен, A остается подключенным.Когда пользователь возвращается к A, B отключается, но A остается подключенным.

Ожидается, что в соответствии с документами .

Я хочу, чтобы B оставался подключенным.Это возможно?Если да, то как?

const ThisStack = createStackNavigator(
  {
    A: {
      screen: ScreenA,
      navigationOptions: ({ navigation }) => ({
        headerLeft: <HamburgerMenuButton navigation={navigation} />,
      }),
    },
    B: {
      screen: ScreenB,
    },
  },
  {
    initialRouteName: 'FOO',
    headerMode: 'screen',
    defaultNavigationOptions: navigationOptions,
  }
);

Почему я хочу, чтобы это было смонтировано?

Что ж, я должен использовать пакет с именем Reactive .У Reactive есть базовый компонент с именем <ReactiveComponent />, который при размонтировании вызывает функцию removeComponent, которую я пытаюсь предотвратить.

Кажется, что Reactive не был создан для использования на разных экранах, но для достижения того, что я пытаюсь выполнить, мне нужно, чтобы его использовали таким образом.

Answer 1

Это довольно просто.В настоящее время вы используете StackNavigation, который работает, монтируя экраны друг на друга и отключая их, когда они больше не нужны.С другой стороны, есть много других вариантов навигации, которые вы можете выбрать, если вы просто хотите перемещаться между различными экранами, не отключая их.Например, TabNavigation, DrawerNavigation SwitchNavigator и т. Д.Или вы даже можете создать свой собственный navigator с помощью react-navigation.

. Здесь я использую switchNavigator, который часто используется для аутентификации, т. Е. Входа пользователя в систему или выхода пользователя из системы.

const ThisStack = createSwitchNavigator(
  {
    A: {
      screen: ScreenA,
      navigationOptions: ({ navigation }) => ({
        headerLeft: <HamburgerMenuButton navigation={navigation} />,
      }),
    },
    B: {
      screen: ScreenB,
    },
  },
  {
    initialRouteName: 'FOO',
    headerMode: 'screen',
    defaultNavigationOptions: navigationOptions,
  }
);

Все, что я сделал, просто использовал createSwitchNavigator вместо createStackNavigator.Дайте мне знать, если это работает для вас