Stack Navigator抽屉图标单击未打开的抽屉，但在滑动时打开

Question

当我单击左侧图标时，我想打开抽屉； 这是我的代码：

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: { } 
    })
  }
});

Answer 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变量的原因。 Notive的DrawerNavigator和StackNavigator被弃用，请createDrawerNavigator和createStackNavigator代替。

希望我的回答有帮助！

Answer 2

打开，关闭和切换抽屉的默认值为：

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

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