Блог

Предположим, у меня есть 2 StackNavigator вложенных бок о бок в a BottomTabNavigator , например, такие:

   const StackA = () => (
    <StackANavigator.Navigator>
      <StackANavigator.Screen
        component={ScreenA1}
        name={'screenA1'}
      />

      <StackANavigator.Screen
        component={ScreenA2}
        name={'screenA2'}
      />
    </StackANavigator.Navigator>
  );

  const StackB = () => (
    <StackBNavigator.Navigator>
      <StackBNavigator.Screen
        component={ScreenB1}
        name={'screenB1'}
      />

      <StackBNavigator.Screen
        component={ScreenB2}
        name={'screenB2'}
      />
    </StackBNavigator.Navigator>
  );

  const App = () => (
    <BottomTabNavigator.Navigator>
      <BottomTabNavigator.Screen
        component={StackA}
        name={'stackA'}
      />

      <BottomTabNavigator.Screen
        component={StackB}
        name={'stackB'}
      />
    </BottomTabNavigator.Navigator>
  );
 

И предположим, что приложение запускается на «screenA1». Я могу перемещаться между стеками, выполняя navigate('stackB') и navigate('stackA') , и я могу перемещаться, например, от ‘screenA1’ к ‘screenB2’ с navigate('stackB', { screen: 'screenB2' }) помощью . Однако это приводит к путанице в стеке B. Если я позвоню goBack оттуда, чтобы перейти к «screenA1», а затем navigate('stackB') я попаду на «screenB2» вместо первоначального маршрута этого стека, который называется «screenB1».

Можно ли избежать такого поведения, не дублируя ‘screenB2’ в стеке A?

Редактировать: для иллюстрации A1 -> A2 -> B2 -> A2 -> A1. Теперь, если я попытаюсь перейти к B1, я перейду к B2

Предполагаемая логика, лежащая в основе навигатора вкладок, заключается в том, что каждая вкладка живет независимо, поэтому очень редко вызывать экран на другой вкладке.

Из-за этого у вас должна быть ссылка на каждый необходимый экран на каждой вкладке. Чтобы избежать ошибок в навигационных маршрутах, вы можете присвоить им названия в зависимости от вкладки.

Если вы хотите иметь отдельную навигацию поверх текущей навигации внутри одной вкладки, вы можете добавить дополнительно модальную.