title: How to hide Drawer item in react-navigation 5x?
body: <p>I'm trying to create a Drawer navigation in my app using react-navigation, but I'm having difficult to hide one item.
  What I want: create some screens (to navigate inside app), but NOT display those screens in Drawer.
  I'm using this doc: (<a href="https://reactnavigation.org/docs/nesting-navigators/#navigator-specific-methods-are-available-in-the-navigators-nested-inside" rel="noreferrer">https://reactnavigation.org/docs/nesting-navigators/#navigator-specific-methods-are-available-in-the-navigators-nested-inside</a>)</p>
  
  <p>But I have two problems: 1) <code>Root</code> still being displayed; 2) I can't navigate direct to 'hidden' screen, it says that screen doesn't exist.</p>
  
  <p>This is my current code:</p>
  
  <pre><code>const Stack = createStackNavigator();
  function Root2() {
    return (
      &lt;Stack.Navigator&gt;
        &lt;Stack.Screen name="NewEditPilot" component={NewEditPilot} /&gt;
        &lt;Stack.Screen name="Settings" component={Settings} /&gt;
      &lt;/Stack.Navigator&gt;
    );
  }
  
  
  const Drawer = createDrawerNavigator();
  
  function MyDrawer() {
    return (
      &lt;Drawer.Navigator drawerContent={props =&gt; &lt;SideBar2 {...props} /&gt;}&gt;
        &lt;Drawer.Screen name="Home" component={Home} /&gt;
        &lt;Drawer.Screen name="PilotMgnt" component={PilotMgnt} /&gt;
        &lt;Drawer.Screen name="Root2" component={Root2} /&gt;
      &lt;/Drawer.Navigator&gt;
    );
  }
  
  
  export default function App() {
  
  
    return (
      &lt;Provider store={store}&gt;
        &lt;PersistGate loading={null} persistor={persistor}&gt;
          &lt;Root&gt;
            &lt;NavigationContainer&gt;
              &lt;MyDrawer /&gt;
            &lt;/NavigationContainer&gt;
          &lt;/Root&gt;
        &lt;/PersistGate&gt;
      &lt;/Provider&gt;
    );
  }
  </code></pre>
  
  <p>In this case, I'm trying to hidde <code>NewEditPilot</code> and <code>Settings</code> screens. This is how I was navigating to these screens: <code>navigation.navigate('NewEditPilot')</code> (this was working on react-navigation 4x).</p>
  
  <p>Also, this is how I was using (and working!) in react-navigation 4x:</p>
  
  <pre><code>// Telas principais
  const Drawer = DrawerNavigator(
    {
      Home: { screen: Home },
      PilotMgnt: { screen: PilotMgnt},
      CurRace: { screen: CurRace},
      Settings: { screen: Settings},        
      LogViewScreen: { screen: LogViewScreen},    
    },
    {
      initialRouteName: "Home",
      contentOptions: {
        activeTintColor: "#e91e63"
      },
      contentComponent: props =&gt; &lt;SideBar {...props} /&gt;
    }
  );
  
  // sub-telas
  const AppNavigator = StackNavigator(
    {
      Drawer: { screen: Drawer },    
      NewEditPilot: { screen: NewEditPilot },
      PersonalRank: { screen: PersonalRank },  
      RCharts: { screen: RCharts},
      RChartsArchive: { screen: RChartsArchive},
      Archive: { screen: Archive },
      ArchiveView: { screen: ArchiveView },
      ArchivePersonalRank: { screen: ArchivePersonalRank },
    },
    {
      initialRouteName: "Drawer",
      headerMode: "none"
    }
  );
  
  
  
  
  export default () =&gt;
      &lt;Provider store={store}&gt;
        &lt;PersistGate loading={null} persistor={persistor}&gt;
          &lt;Root&gt;
            &lt;AppNavigator /&gt;
          &lt;/Root&gt;
        &lt;/PersistGate&gt;
      &lt;/Provider&gt;
    ;
  </code></pre>