Как реализовать разные "ветки" в реагировать на нативный стековый навигатор

Question

Некоторое время назад я использовал act-native-router-flux, он использует вложенные сцены для реализации различных «веток», поэтому вы можете отслеживать историю навигации и жизненный цикл каждой ветви независимо, например:

<Router sceneStyle={{ paddingTop: 65 }}>
      <Scene key="auth">
        <Scene key="login" component={LoginForm} title="Please Login" />
      </Scene>

      <Scene key="main">
        <Scene
          title="Employees"
          initial
        />
        <Scene key="employeeCreate" component={EmployeeCreate} title="Create Employee" />
        <Scene key="employeeEdit" component={EmployeeEdit} title="Edit Employee" />
      </Scene>
 </Router>

При переходе на реагирование-навигацию, как реализовать этот подход «вложения»?

Answer 1

Я не уверен, как "Nesting" или "Branching" работает в react-native-router-flux, но, глядя на ваш код выше, я считаю, что наиболее близким к нему является SwitchNavigator в React Navigation.Вы можете использовать его для потоков аутентификации.Вы сделаете отдельную StackNavigator для предварительного входа в состояние приложения и одну для состояния после входа в систему.Примерно так:

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

const main = createStackNavigator({
    employees: Employees,
    employeeCreate: EmployeeCreate,
    employeeEdit: EmployeeEdit
});
const auth = createStackNavigator({ login: LoginForm });

export default createSwitchNavigator(
  {
    App: main,
    Auth: auth,
  },
  {
    initialRouteName: 'Auth',
    navigationOptions: { header: null }
  }
);

Однако помните, что при переходе из одного стека в другой предыдущий стек будет сброшен (вся информация в этом предыдущем стеке будет потеряна, и вы не сможете перейтииз одного стека в другой, просто нажав кнопку Back).

Более подробный пример приведен в официальной документации здесь .Здесь есть Medium post здесь (хотя и несколько устаревший), который также может вам помочь.