I have a stack navigator using react-navigation 3.3.0 and I want to have a drawer navigation for a specific screen

Question

I am trying to make an iOS mobile app with react native. Right now, I have a stack navigator in App.js

export const Navigation = createAppContainer(
  createStackNavigator({
    Screen1: { screen: Screen1 },
    Screen2: { screen: Screen2 },
    Screen3: { screen: Screen3 },
    Screen4: { screen: Screen4 },
  }),
)

I would like to have a drawer navigator for screen 4 on the left button on header instead of a back button. I tried to follow examples but it is not working.

Answer 1

Create a Drawer navigator like this,

const DrawerNavigator = createDrawerNavigator({
Screen4: { screen: Screen4 }
}

Then use this DrawerNavigator in your stack navigator like,

export const Navigation = createAppContainer(
  createStackNavigator({
    Screen1: { screen: Screen1 },
    Screen2: { screen: Screen2 },
    Screen3: { screen: Screen3 },
    drawer:DrawerNavigator ,
  }),
)