Stack Navigator 抽屉图标单击抽屉未打开但滑动打开时答案

【问题标题】：Stack Navigator drawer icon click drawer not opening but when slide it openingStack Navigator 抽屉图标单击抽屉未打开但滑动打开时
【发布时间】：2019-04-04 12:25:21
【问题描述】：

我希望在单击左侧图标时打开抽屉；这是我的代码：

const stackNav = StackNavigator({
  Main : {
    screen: MainScreen,
    navigationOptions: ({navigation}) => ({
      title: "Easy Billing",
      headerLeft: (
        <TouchableOpacity onPress={() => navigation.navigate("DrawerOpen")}>
          <IOSIcon name="ios-menu" size={30} onPress={() => navigation.navigate("DrawerOpen")} />
        </TouchableOpacity>
      ),
      headerStyle: { } 
    })
  }
});

【问题讨论】：

标签： javascript react-native react-navigation

【解决方案1】：

试试：

import { DrawerActions, createDrawerNavigator } from 'react-navigation';

然后：

const stackNav = createDrawerNavigator({
  Main : {
    screen: MainScreen,
    navigationOptions: ({navigation}) => ({
      title: "Easy Billing",
      headerLeft: (
        <TouchableOpacity onPress={() => { navigation.dispatch(DrawerActions.openDrawer()); }}>
          <IOSIcon name="ios-menu" size={30} onPress={() => { navigation.dispatch(DrawerActions.openDrawer()); }} />
        </TouchableOpacity>
      ),
      headerStyle: { } 
    })
  }
});

您在使用 stackNavigator 时无法显示抽屉；这就是我使用 createDawerNavigator 变量的原因。请注意，DrawerNavigator 和 StackNavigator 已弃用，请改用 createDrawerNavigator 和 createStackNavigator。

【讨论】：

嗨，Steve Nossse，它在滑动时工作，但抽屉图标和标题没有显示，你能帮我吗
可能是因为在 headerStyle 上返回 null ？删除它并重试

【解决方案2】：

打开、关闭和切换抽屉的默认设置是：

this.props.navigation.openDrawer();
this.props.navigation.closeDrawer();
this.props.navigation.toggleDrawer();

您可以在按钮的 onPress 属性中使用它们。像这样， <Button onPress={() => { this.props.navigation.openDrawer(); }} />

【讨论】：