How To Handle Two Navigator In React Navigation?

Hello Guys, I have some issue with React navigation V3, In my app, I have an Authentication step to Entering to Home Screen and it doesn't have a Drawer Navigation as a default, it

Solution 1:

Not sure if I understand your question so well, But what I suggest is to make each navigator in a different file like for example your StackNavigation in a file called "firstActivity_StackNavigator.js" and then you need to export the navigator as follow:

...
constFirstActivity_StackNavigator = createStackNavigator({
  Home: {
    screen: Home,
    navigationOptions: ({ navigation }) => ({
      title: 'Home',
      headerLeft: <NavigationDrawerStructurenavigationProps={navigation} />,
      headerStyle: {
        backgroundColor: '#FF9800',
        shadowOpacity: 0,
        elevation: 0,
      },
      headerTintColor: '#fff',
    }),
  },
});
exportdefaultFirstActivity_StackNavigator;

Then in your main navigator you just import whatever navigators you want

importFirstActivity_StackNavigator from"./firstActivity_StackNavigator.js"importScreen2_StackNavigator from"./screen2_StackNavigator.js"constDrawerNavigatorExample = createDrawerNavigator({
  //Drawer Optons and indexingScreen1: {
    //Titlescreen: FirstActivity_StackNavigator,
    navigationOptions: {
      drawerLabel: 'Home',
      drawerIcon: () => (
        <Iconname="ios-home"size={30}color='#009' />
      ),
    },

  },
  Screen2: {
    screen: Screen2_StackNavigator,
    navigationOptions: {
      drawerLabel: 'Order',
      drawerIcon: () => (
        <Iconname="ios-list-box"size={30}color='#009' />
      ),
    },
  },

});
...

Hopefully this answer your question