title: React-Navigation: Hide Parent header
body: <p><strong>Problem:</strong> i have a DrawerNavigator that contains a TabNavigator which contains a StackNavigator, what i needed is the regular three bar icon in the header to open the Drawer instead of swiping right</p>
  
  <p><strong>My Solution:</strong> put the TabNavigator that contains a StackNavigator inside a StackNavigator and put the StackNavigator inside the DrawerNavigator</p>
  
  <p><strong>Problem with my solution:</strong> when i navigate inside the TabNavigator i get double headers (it's normal because i have 2 StackNavigators) and i can only hide the back arrow header, i always get left with the 3 tabs icon header.</p>
  
  <p>so how please how can i hide the parent header which contains TabNavigator?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>//the drawer navigator
  const DNav = DrawerNavigator({
          SportWall: {
              screen: SportWall
              }
          })
          
  //the stack that contains the tab navigator
  export default StackNavigator({
      SportWall: {
          //just to show the header with the 3 bars icon
          screen: SportWall
      }
      
  render() {
    return (
        &lt;Tabs/&gt;
    )
  }
      
  //the tab navigator
  const Tabs = TabNavigator({
      AllPubs: {
          screen: AllPubs
      },
      FriendsPubs: {
          screen: FriendsPubs
      },
  });
  
  //the stack inside each tab 
  export default StackNavigator({
      AllPubs: {
          screen: AllPubs,
      },
      Pub: {
          screen: Pub, navigationOptions: {tabBarVisible: false}
      },...</code></pre>
  </div>
  </div>
  </p>