单击底部标签导航器上的反应导航关闭抽屉

问题描述 投票:0回答:1

我的react navigation设置如下。当在抽屉组件外面按一下时,可以关闭抽屉。 (但当我单击bottom navigator tabs part时不可以)。单击底部导航时如何关闭抽屉?

const HomeFilterDrawer = createDrawerNavigator(
  {
    Home: {
      screen: HomeScreen,
      navigationOptions: ({navigation}) => ({
        header: null,
      }),
    },
  },
  {
    initialRouteName: 'Home',
    contentComponent: DrawerComponent,
    drawerPosition: 'right',
  },
);

const HomeScreenStack = createStackNavigator(
  {
    Home: {
      screen: HomeFilterDrawer,
      navigationOptions: ({navigation}) => ({
        header: null,
      }),
    },
    Search: {
      ...
    },
  }
);

const AppNavigator = createBottomTabNavigator(
    Home: {
      screen: HomeScreenStack,
      navigationOptions: {
        tabBarLabel: 'Home,
        tabBarIcon: tabInfo => {
          return (
            <Ionicons name="ios-home" size={25} />
          );
        },
        tabBarOnPress: ({navigation}) => {
          navigation.popToTop();
          navigation.navigate(navigation.state.routeName);
        },
      },
    },
);

enter image description here

react-native react-navigation
1个回答
0
投票

您是否尝试使用DrawerActions合上抽屉?

import { DrawerActions } from '@react-navigation/routers';
// ...

// in tabbaronPress call the following
navigation.dispatch(DrawerActions.closeDrawer());
© www.soinside.com 2019 - 2024. All rights reserved.