0

我最近react-navigation从 v5 更新到 v6。之后,我注意到它navigation.dispatch(DrawerActions.openDrawer())不再适用于 android 设备,但适用于 iOS 设备。

const Navigation = (props) => {
  return (
    <NavigationContainer>
      <Root.Navigator>
        <Root.Screen
          name='Vahginonsattuessa'
          component={DrawerNav}
          options={({ navigation }) => { // this part 
            return {
              headerShown: true,
              headerTransparent: true,
              headerTitle: '',
              headerRight: () => (
                <Ionicons
                  testID="DrawerMenu"
                  name='ios-menu-outline'
                  size={40}
                  color={colors.black}
                  onPress={() =>
                    navigation.dispatch(DrawerActions.openDrawer())
                  }
                />
              ),
            }
          }}
        />
      </Root.Navigator>
    </NavigationContainer>

但是当我将根堆栈中的选项添加到底部选项卡主屏幕选项时,它也可以在 android 上运行,但是在 iOS 设备上,汉堡包按钮无法触及,无法点击。 在此处输入图像描述

const HomeTab = () => {
  return (
    <Tab.Navigator
      screenOptions={({ route }) => ({
        tabBarIcon: ({ focused, color, size }) => {
          let iconName

          if (route.name === 'Home') {
            iconName = focused ? 'ios-home' : 'ios-home-outline'
          } else if (route.name === 'Palvelut') {
            iconName = focused ? 'ios-pin' : 'ios-pin-outline'
          } else if (route.name === 'Ukk') {
            iconName = focused ? 'ios-help-circle' : 'ios-help-circle-outline'
          } else if (route.name === 'Omat tiedot') {
            iconName = focused
              ? 'ios-person-circle'
              : 'ios-person-circle-outline'
          }
          // You can return any component that you like here!
          return <Ionicons name={iconName} size={size} color={color} />
        },
        tabBarActiveTintColor: colors.red,
        tabBarInactiveTintColor: colors.black,
        tabBarStyle: [
          {
            "display": "flex"
          },
          null
        ]
      })}
    >
      <Tab.Screen name='Home' component={HomeScreen} options={{headerTitle: '', headerTransparent: true, }} /> // here in options
      <Tab.Screen name='Palvelut' component={ServicesScreen} />
      <Tab.Screen name='Ukk' component={UkkScreen} />
      <Tab.Screen name='Omat tiedot' component={ProfileScreen} />
    </Tab.Navigator>
  )
}

当它回到代码之前的位置时,它应该看起来像这样,但是 android one 不起作用。 在此处输入图像描述

我也没有在控制台中收到任何错误。

4

0 回答 0