androidiosreact-nativemobileappcontainer

How to navigate between a few AppContainers


how can I navigate between AppContainers?

I'm detecting a correct stack in App.js

const stack = User.isAuthorized() ? authStack : unauthStack;

After user enter the login and password, he need switch the stack from unauthStack.SignIn to authStack.List.

const unauthStack = createAppContainer(createStackNavigator({
    SignIn: { screen: SignIn },
    ForgotPassword: { screen: ForgotPassword },
}));

const authStack = createAppContainer(createBottomTabNavigator({
        List: { screen: GeneralStack },
        Add: { screen: NewEventStack },
}));

I've tried to Google it but can't find any working examples. And saw some information that complete reload the app could be a reason of memory leak or something like that...

So what's the correct way to do this?


Solution

  • You shouldnt approach multiple containers, rather make 2 stacks and adda switchNavigator and if its logged in then display accordingly. See example below:

    const navigation = createAppContainer(
      createSwitchNavigator(
        {
          App: HomeStack, // these are after login pages
          Auth: AuthStack,// these are before login pages
        },
        {
          initialRouteName: isToken?'App':'Auth', //checking if token exists
        },
      ),
    );
    

    Please check the code and if any doubts do ask.

    Hope it helps