如何为TabNavigator添加StackNavigator？

Question

我有一个应用程序，需要StackNavigator和TabNavigator。逻辑是这样的：

const App = StackNavigator({
    Welcome: {
        screen: Welcome
    },
    Login: {
        screen: Login
    },
    Register: {
        screen: Register
    },
    Auth: {
        screen: Auth
    },
    Home: {
        screen: Main
    },
});

const Main = TabNavigator({
  Home: { screen: Home },
  Dash: { screen: Dash},
  Myself: { screen: Myself},
  });

const Pages = StackNavigator({
    Share: { screen: Share},
    About: { screen: About},
    Service: {screen: Service}
});  

我可以正确地处理如何从App跳转到App，但是在TabNavigator in screen Myself中，我想跳转到StackNavigator Pages，如果我将它直接添加到Main中，它不起作用。

那么我如何才能做到这一点呢？

Answer 1

您需要做的事情类似于使用Main将TabNavigator放入StackNavigator中。您还可以将StackNavigator放入TabNavigator中。在这种情况下，您希望使用Pages导航器作为Main TabNavigator上的MySelf路由，而不是在TabNavigator路由上使用页面MySelf，而是将MySelf作为Pages StackNavigator上的初始路由。

它看起来像这样：

...
const Pages = StackNavigator({
  Index: { screen: MySelf },
  Share: { screen: Share },
  About: { screen: About },
  Service: { screen: Service },
}); 

const Main = TabNavigator({
  Home: { screen: Home },
  Dash: { screen: Dash},
  Myself: { screen: Pages},
});