react-native - 是否有禁用标签栏按钮的选项

Question

在我的 react native 应用程序中，我有一个使用 react-navigation-material-bottom-tabs 的路由器组件。

在那个组件中，我像这样创建了它。

const tabNavigator = createMaterialBottomTabNavigator({
  home: {
    screen: Home,
    navigationOptions: ({ navigation }) => ({
        title: ''
    })
  },
  createCampaign: {
    screen: CreateCampaign,
    navigationOptions: ({ navigation }) => ({
        title: '',
        tabBarVisible: false
    })
  },
  settings: {
    screen: AllSettings,
    navigationOptions: ({ navigation }) => ({
        title: ''
    })
  }
});

这工作正常。但我想在某些情况下禁用此栏的某些选项卡。例如，如果配置文件尚未获得批准，请禁用设置选项卡。有什么办法可以在我的屏幕上执行此操作吗？（如果它不在路由器中会更好，因为我无法在路由器中发送 API 请求）。如何访问屏幕中的 tabBar 选项？如何禁用标签？请帮忙。

标签： react-nativereact-navigation-bottom-tab

Answer 1

因为Version 5.x有一种新的方法可以做到这一点。

<Tabs.Screen
  name="Chat"
  component={Chat}
  listeners={{
    tabPress: e => {
      // Prevent default action
      e.preventDefault();
    },
  }}
/>

这是文档的参考链接：https ://reactnavigation.org/docs/navigation-events/