Переключение между компонентами в React Navigation

Question

Я пытаюсь использовать React Navigation из этого урока:

https://reactnavigation.org/docs/en/auth-flow.html

Код работает правильно, но когда я делю его на несколько компонентов, я могу вызвать компонент Login изRoot, но я не могу перейти к другим экранам из компонента Login, потому что мой стек определен в Root login, а компонент Login не знает стек.Вот мой код:

App.js:

    import Login from './components/Login';

    class SignInScreen extends React.Component {
        static navigationOptions = {
          title: 'Please sign in',
        };

        render() {
          return (
                <Login />
          );
        };
    }
....

      const AppStack = createStackNavigator({ Home: HomeScreen, Other: OtherScreen });
      const AuthStack = createStackNavigator({ SignIn: SignInScreen });

      export default createAppContainer(createSwitchNavigator(
        {
          AuthLoading: AuthLoadingScreen,
          App: AppStack,
          Auth: AuthStack,
        },
        {
          initialRouteName: 'AuthLoading',
        }
      ));

Login.js:

class Login extends Component {

    render(){
        return(
                 <View>
                    ........
                 <View>
        );
    }
    _signInAsync = async () => {
        await AsyncStorage.setItem('userToken', 'abc');
        this.props.navigation.navigate('App');
      };

};

export default Login;

Answer 1

Вы можете использовать withNavigation HOC для доступа к стеку из компонента Login.

Подробнее об этом здесь: https://reactnavigation.org/docs/en/with-navigation.html