如何使 tabBarNavigator 的屏幕在 TabBar 上不可见？答案

【问题标题】：How to make screen from tabBarNavigator invisible on TabBar?如何使 tabBarNavigator 的屏幕在 TabBar 上不可见？
【发布时间】：2018-11-22 11:04:07
【问题描述】：

我使用 react-navigation 3.x 版。如何使 tabBarNavigator 的屏幕在 TabBar 上不可见？

我需要从 tabBar 中删除主屏幕（它应该是不可见的）但 TabBar 必须在主屏幕上。

接下来是我的屏幕结构：

const AppStackNavigator = createStackNavigator({
    loginFlow: { 
      screen: createStackNavigator({
        intro: { screen: Intro },
        login: { screen: Login },
        registration: { screen: Registration }
      })
    },
    mainFlow: {
      screen: createStackNavigator({

        // settings: { screen: SettingsScreen },
        someTab: { 
          screen: createBottomTabNavigator({
            main: { screen: Home },
            Tab1: { screen: Tab1 },
            Tab2: { screen: Tab2 },
            Tab3: { screen: Tab3 },
            Tab4: { screen: ChatMain }
          })
        }
      })
    }
  });

【问题讨论】：

您的问题自相矛盾。您想从 tabBar 中删除主屏幕（它应该是不可见的）但 TabBar 必须在主屏幕上？您期望做什么？如果可以帮助您更好地解释，请附上屏幕截图。
主屏幕必须有 tabBar 但在 babBar 上必须只有 4 个图标和 Tab1-Tab4 的标题可见
汉尼拔，您对下面提供的帮助进展如何？

标签： react-native react-navigation react-navigation-stack

【解决方案1】：

你的问题措辞很奇怪，但我会给你我的两种解释的答案：

如果您想从标签栏中删除屏幕，只需将其注释掉即可：

// main: { screen: Home },

如果您希望主屏幕与标签栏的其余部分位于同一堆栈中，但不希望它显示在标签栏中，您可以将其嵌套在 switchNavigator 中：

mainFlow: {
  screen: createStackNavigator({
    // settings: { screen: SettingsScreen },
    someSwitch: createSwitchNavigator({
      main: { screen: Home },
      someTab: { 
        screen: createBottomTabNavigator({
          Tab1: { screen: Tab1 },
          Tab2: { screen: Tab2 },
          Tab3: { screen: Tab3 },
          Tab4: { screen: ChatMain }
        })
      }
    })
  })
}

【讨论】：

【解决方案2】：

其实我只是使用了我自己的 TabBar 组件。只需要使用tabBarComponent 属性即可。

【讨论】：