Deprecation in "navigationOptions": -"header: null" will be removed

Question

React navigation version 4.3.9

My iOS emulator is throwing an annoying warning, but otherwise it works.

I have a stack navigator with a number of screens. My App.js file loads the stack navigator with the first screen showing. It's a console screen with a number of buttons that load screens from the stack navigator.

I want the first console screen not to have a header, as it doesn't fit with the designers layout.

This works fine:

  const PlanCalcNavigator = createStackNavigator({
   Console: {
     screen: ConsoleScreen,
     navigationOptions: {
       header: null // hides header in first screen
     }
   },
   PlanEvent: PlanEventScreen,
   Calc: CalculatorScreen,
  },
 );

But my iOS emulator keeps throwing up the "Deprecation in "navigationOptions": -"header: null" will be removed" warning which is very annoying.

Is there some other term that I can use that won't throw the error?

headerMode: 'none' doesn't work. It doesn't throw an error, but the console screen shows the header.

Answer 1

you can use

  navigationOptions:{
    headerShown: false
  }

Answer 2

you can use

<Stack.Navigator screenOptions={{ headerShown: false }}>
  <Stack.Screen name="Home" component={Home} />
  <Stack.Screen name="Profile" component={Profile} />
</Stack.Navigator>

Answer 3

navigationOptions: { header: null // hides header in first screen } That's good. Need to upgrade React navigation version 4.4.0 You need to add headerMode as your fav.