title: What is the canonical way to support navigators in tabs in React Native?
body: <p>I'm interested in determining if there is a "canonical" way to have the <code>Navigator</code> and <code>TabBarIOS</code> place nice together. One way I could see is to have a <code>Navigator</code> per instance of a tab view. For example, we could have 2 tabs with each tab having a navigator:</p>
  
  <pre><code>&lt;TabBarIOS&gt;
    &lt;TabBarIOS.Item
      title="Tab 1"
      selected={this.state.selectedTab === 'tab1'}
      onPress={() =&gt; this.setState({ selectedTab: 'tab1' }) }
    &gt;
      &lt;Navigator
        renderScene={(route, navigator) =&gt;
          &lt;Text&gt;Scene 1&lt;/text&gt;
        }
      /&gt;
    &lt;/TabBarIOS.Item&gt;
  
    &lt;TabBarIOS.Item
      title="Tab 2"
      selected={this.state.selectedTab === 'tab2'}
      onPress={() =&gt; this.setState({ selectedTab: 'tab2' }) }
    &gt;
      &lt;Navigator
        renderScene={(route, navigator) =&gt;
          &lt;Text&gt;Scene 2&lt;/text&gt;
        }
      /&gt;
    &lt;/TabBarIOS.Item&gt;
  &lt;/TabBarIOS&gt;
  </code></pre>
  
  <p>However, I'm not sure if this is the recommended way of doing this. Any suggestion as to how to handle this pattern?</p>