滑动手势无法在React-Navigation中打开/关闭抽屉

Question

我在React-Navigation V3中使用React-Native

这是我用于DrawerNavigator和StackNavigator的代码

import React from "react";
import { StyleSheet, TouchableOpacity } from "react-native";
import { createStackNavigator, createDrawerNavigator } from "react-navigation";
import MaterialIcon from "react-native-vector-icons/MaterialIcons";
import FontAwesome5Icon from "react-native-vector-icons/FontAwesome5";
import Home from "../Home";
import Profile from "../Profile";
import DrawerContainer from "../common/DrawerContainer";
import Colors from "../../helpers/Colors";

const styles = StyleSheet.create({
  drawerButton: {
    paddingRight: 20,
    paddingTop: 4
  },
  alertButton: {
    paddingLeft: 15,
    paddingTop: 2
  }
});

const DrawerStack = createDrawerNavigator(
  {
    Home: { screen: Home },
    Profile: { screen: Profile }
  },
  {
    // contentComponent: DrawerContainer,
    drawerPosition: "right",
    drawerWidth: 200
  }
);

const drawerButton = navigation => (
  <TouchableOpacity onPress={navigation.toggleDrawer}>
    <MaterialIcon
      name="menu"
      size={27}
      color="white"
      style={styles.drawerButton}
    />
  </TouchableOpacity>
);

const AlertButton = () => (
  <TouchableOpacity>
    <FontAwesome5Icon
      name="bell"
      size={21}
      color="white"
      light
      style={styles.alertButton}
    />
  </TouchableOpacity>
);

const AppStack = createStackNavigator(
  {
    DrawerStack: { screen: DrawerStack }
  },
  {
    defaultNavigationOptions: ({ navigation }) => ({
      headerStyle: { backgroundColor: Colors.primary },
      title: "Title",
      headerTitleStyle: {
        fontFamily: "casual",
        marginTop: 5,
        textAlign: "left",
        flex: 1
      },
      headerTintColor: "white",
      headerLeft: drawerButton(navigation),
      headerRight: AlertButton()
    })
  }
);

export default AppStack;

由于某种原因，当我尝试将抽屉打开后滑开时，它不起作用，也无法通过滑动手势打开抽屉。

我只在Android，Nexus 5和仿真器以及LG G4真实设备上对其进行了测试。