React-Navigation: Navigation in nested navigators

2
votes

I'm developing a react-native app with react-navigation.

Here is my navigation tree:

Root (StackNavigator)
 -- Login
 -- Main (DrawerNavigator)
 ---- Screen1
 ---- Screen2
 ---- Settings

I have two problems here:

  1. How to reset StackNavigator after user has successfully logged in. So when the user is in Screen1 and presses the back button he doesn't navigate to the login screen again.
  2. How I can navigate from Settings screen to Login screen in order to logout the user?

I'm using React-Navigation v1.2 (and for some particular reason I can't upgrade it to v2).

And here is my code:

const StartNav = StackNavigator({
    Login: { screen: Login },
    Main: { screen: Main },
});

const Main = DrawerNavigator({
    Screen1: {
        screen: Screen1
    },
    Screen2: {
        screen: Screen2
    },
    Setting: {
        screen: Setting
    }
});

Thanks in advance.

1
react-nativereact-navigation

1 Answers

1
votes

It seems to me you can accomplish everything by simply using a SwitchNavigator? Also from your settings screen you can go back to login by just calling .navigate(Login) and it will find the right one.