react-native - TabNavigator 中的 StackNavigator 是否可能？

Question

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

我发现了很多嵌套在 Stack 或 Drawer 内的 Tab 示例，但没有找到 Tab 内嵌套 Stack 的示例！

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

标签导航器：
 - 设置屏幕（选项卡 1）
       -关于我们（点击按钮打开关于我们屏幕）
       - 帐户设置（单击按钮打开关于我们屏幕）
       -联系我们（点击按钮打开关于我们屏幕）
 - 搜索屏幕（选项卡 2）
 - 配置文件屏幕（选项卡 3）

任何关于它们是否可能的建议将不胜感激！:)

标签： react-nativetabsnestedstackreact-navigation

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',
})

...

希望它有所帮助。