react-native - react native 导航v5选项卡按不起作用

Question

从代码中可以看到，没有调用tabPress，我做错了还是缺少什​​么，不幸的是，我没有找到任何适用于React Navigation版本5的代码示例。

<Tab.Navigator labeled={false} barStyle={{backgroundColor: '#ffffff', height: 55}} options={{
        tabPress: ({navigation}) => {
            console.log('nav tab press triggered')
        }
    }}>
        <Tab.Screen name={`DeviceNavigatorTab`} component={DeviceNavigator} options={{
            tabBarIcon: ({tintColor}) => <Image source={require('../../images/feather_home-menu.png')}
                                                style={{width: 26, height: 26, tintColor}}/>,
            tabPress: ({navigation}) => {
                console.log('tab press triggered')
            }
        }} tabPress={() => { console.log('prop tab pressed') }}/>
        <Tab.Screen name={`AlarmNavigatorTab`} component={AlarmNavigator} options={{
            tabBarIcon: ({tintColor}) => <Image source={require('../../images/feather_alert-circle.png')}
                                                style={{width: 26, height: 26, tintColor}}/>,
        }}/>
        <Tab.Screen name={`ProfileNavigatorTab`} component={ProfileNavigator} options={{
            tabBarIcon: ({tintColor}) => <Image source={require('../../images/feather_user.png')}
                                                style={{width: 26, height: 26, tintColor}}/>,
        }} />
    </Tab.Navigator>

Answer 1

我在文档中发现了一些以前从未见过的新内容，这是将监听器添加到屏幕的方式，每次用户单击选项卡时，它将转到该选项卡内的第一个堆栈屏幕
https://reactnavigation.org/docs/navigation-events/#listeners-prop-on-screen

<Tab.Screen 
  name="DeviceNavigatorTab" 
  component={DeviceNavigator} 
  listeners={({ navigation, route }) => ({
    tabPress: e => {
      if (route.state && route.state.routeNames.length > 0) {
          navigation.navigate('Device')
      }
    },
  })}
/>