react-native - TabNavigator 中是否可以使用 StackNavigator？

Question

我使用 createMaterialTopTabNavigator 创建了一个自定义选项卡导航器，但在其中一个选项卡中我想创建一个 StackNavigator。这可能吗？

我发现了很多嵌套在 Stack 或 Drawer 中的 Tabs 示例，但没有发现 Tab 中嵌套 Stack 的示例!

本质上，我希望在导航到其他一些屏幕的选项卡屏幕之一上有几个按钮，但我不想导航出选项卡。 (初始选项卡始终可见/选中)- 只是您可以单击一个按钮并转到另一个屏幕然后返回。

标签导航器:
- 设置屏幕(选项卡 1)
-关于我们(点击按钮打开关于我们屏幕)
- 账户设置(点击按钮打开关于我们屏幕)
- 联系我们(点击按钮打开关于我们屏幕)
- 搜索屏幕(标签 2)
- 个人资料屏幕(选项卡 3)

任何有关是否可能的建议将不胜感激! :)

Answer 1

是的，你可以这样做

您可以通过执行类似的操作将 StackNavigator 嵌套在 TabNavigator 中 -

import { TabNavigator, StackNavigator } from 'react-navigation'

export const TabNavigator = TabNavigator({
    SettingsScreenStack: { screen: SettingsScreenStack },
    SearchScreen: { screen: SearchScreen },
    ProfileScreen: { screen: ProfileScreen },
  }, {
    order: ['SettingsScreenStack', 'SearchScreen', 'ProfileScreen'],
    initialRouteName: 'SettingsScreenStack',
});

export const SettingsScreenStack = StackNavigator({
    AboutUsScreen: { screen: AboutUsScreen },
    AccountSettingsScreen: { screen: AccountSettingsScreen },
    ContactUsScreen: { screen: ContactUsScreen },
  }, {
    initialRoute: 'AboutUsScreen',
})

...

希望它有所帮助。