tabBarOnPress 在 React Navigation v5 中不可用

Question

我正在使用带有@react-navigation/bottom-tabs 的 React Navigation v5，我的标签看起来像这样。

<NavigationContainer>
  <Tab.Navigator>
    <Tab.Screen name="Home" component={HomeScreen} />
    <Tab.Screen name="Modal" component={ModalScreen} />
    <Tab.Screen name="Settings" component{SettingsScreen} />
  </Tab.Navigator>

我想在 Home 和 Settings 标签上打开屏幕，但在 Modal 标签上，我想打开一个模式 为此，在 React Navigation v4 中，可以使用 tabBarOnPress 来运行回调，但在 React Navigation v5 中不可用，在 React Navigation v5 中 tabBarOnPress 是否有任何替代方案？

任何帮助将不胜感激！

Answer 1

你需要使用tabPress事件：

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

https://reactnavigation.org/docs/bottom-tab-navigator#events

https://reactnavigation.org/docs/navigation-events#listeners-prop-on-screen