reactjs - 在 TabNavigator 中隐藏 TabBar 项目

Question

如何从 TabNavigator 隐藏某些 TabBar 项目。有没有TabBarOptions选项，其中有 visible键(真/假)像这样？

const Tabs = TabNavigator({
  Home: {
    screen: Home
  },
  Profile: {
    screen: Thanks,
    tabBarOptions: {
      visible: false
    },
  },
  More: {
    screen: More
  },
})

Answer 1

没有用于从 TabNavigator 隐藏特定项目的“可见”选项。

您需要创建一个 Stacknavigator 和一个 Tabnavigator。在 Stacknavigator 中，您将添加您的“不可见”标签栏项目，并在最后添加“可见”标签栏项目的 Tabnavigator。

作者:@ragnorc来自 GitHub

const TabsScreen = TabNavigator({
  Profile: { // visible TabBar item
    screen: Thanks,
    tabBarOptions: {
      visible: false
    },
  },
  More: { // visible TabBar item
    screen: More
  },
})

const MainScreenNavigator = StackNavigator({
    Home: { // invisible TabBar item
        screen: Home,
        navigationOptions : {
            header: null /* hide header*/
        }
    },
    Screen 2: { }, // invisible TabBar item
    Screen 3: { }, // invisible TabBar item
    Screen 4: { }, // invisible TabBar item
    TabsScreen: { 
        screen: TabsScreen,
        navigationOptions : {
            header: null /* hide header*/
        }
    },
});