使用时如何从底部选项卡栏隐藏“特定选项卡栏项目”：@react-navigation/bottom-tabs

Question

这是一个视频，展示了我当前所有可见的底部选项卡项目：主页、我的帐户、购物车和菜单。https://streamable.com/no6anz

我想在屏幕上渲染其他底部选项卡项，但在底部选项卡栏本身中不可见。（例如：SettingsView）

如何使用 React Native 导航 v5 实现此目的？

Answer 1

只需在您不想显示的元素（Tab.Screen）上渲染一个 null tabBarButton。

<Tab.Screen
    name="SignIn"
    component={SignInScreen}
    options={{
      tabBarButton: (props) => null, //like this
      tabBarStyle: { display: 'none' }, //this is additional if you want to hide the whole bottom tab from the screen version 6.x
    }}
  />