Экспорт реагирует на собственный stackNavigator после проверки значения в AsyncStorage

Question

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

Подход 1

const getValue = async () => {
    try {
        value = await AsyncStorage.getItem('token').then((value) =>{
           console.log(value)
        })
    } catch (error) {
        console.log(error.message);
    }
};

if (token != undefined) {
    stackNavigator = createStackNavigator({
        Products: Products,
        Product: Product
    }, {
        headerMode: 'none',
        navigationOptions: {
            headerVisible: false
        }
    })
} else {
    stackNavigator = createStackNavigator({
        Home:Home,
        Products: Products,
        Product: Product
    }, {
        headerMode: 'none',
        navigationOptions: {
            headerVisible: false
        }
    })
}

При первом подходе он всегда отображает домашний экран, даже если токен хранится в приложении

Второй подход

const getValue = async () => {
    try {
        value = await AsyncStorage.getItem('token').then((value) =>{
            if(value == null){
                stackNavigator = createStackNavigator({
                    Home:Home,
                    Products: Products,
                    Product: Product
                }, {
                    headerMode: 'none',
                    navigationOptions: {
                        headerVisible: false
                    }
                })
            }else{
                stackNavigator = createStackNavigator({
                    Products: Products,
                    Product: Product
                }, {
                    headerMode: 'none',
                    navigationOptions: {
                        headerVisible: false
                    }
                })
            }
        })
    } catch (error) {
        console.log(error.message);
    }
};

Этот подход выдает Cannot read property of router undefined

Есть ли способ заставить это работать?

Навигация. js

export const getValue = async () => {
    let VALUE;
  try {

      await AsyncStorage.getItem('token')
      .then((value) =>{
          if(value == null){
            VALUE = stackNavigator = createStackNavigator({
                  Home:Home,
                  Products: Products,
                  Product: Product
              }, {
                  headerMode: 'none',
                  navigationOptions: {
                      headerVisible: false
                  }
              })
          }else{
            VALUE =  stackNavigator = createStackNavigator({
                  Products: Products,
                  Product: Product
              }, {
                  headerMode: 'none',
                  navigationOptions: {
                      headerVisible: false
                  }
              })
          }
      })
  } catch (error) {
      console.log(error.message);
  }

 return VALUE;

};

Приложение. js

import { getValue } from './layout/navigation/Navigation';
let Navigation = createAppContainer(getValue());
class App extends React.Component {

    render() {
        return (<Navigation/>)
    }
}

Answer 1

Создать маршрут

stackNavigator = createStackNavigator({
    Home:Home,
    Products: Products,
    Product: Product,
    Login : Login
  }, 
  {
    headerMode: 'none',
    initialRouteName : 'Home',  // provide initial route : app will open with Home page 
    navigationOptions: {
        headerVisible: false
    },
})

 // Export it with createAppContainer 
 export default createAppContainer(stackNavigator);

Импортируйте его в свое приложение. js и используйте его как <Router/>

import Router from 'Application/navigation/routes';

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

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