React native 如何在react native中禁用滑动打开而不是关闭？

我想禁用滑动以打开抽屉导航，但不用于关闭

我为android找到了解决方案，但没有为react native找到。 目前我使用的是：

drawerLockMode: 'locked-open'

它能用，但我不能用刷子把它关上

我正在打开带有汉堡菜单图标的抽屉，如下所示：

onPress={() => props.navigation.toggleDrawer()}

有人已经这么做了吗？ 有没有办法全局设置

drawerLockMode

？ 是否存在

onDrawerOpened

和

onDrawerClosed

道具？

---

谢谢

如果您使用的是react navigation，则当与导航相关的任何内容发生更改时，您可以获取触发的事件。即使是抽屉打开或抽屉关闭事件。（我现在不能给出一个有效的例子。）

有关更多信息，请点击以下链接。

---

尝试获取事件对象信息以检测和覆盖行为。

如果使用react导航，则可以获取在与导航相关的任何更改时触发的事件。即使是抽屉打开或抽屉关闭事件。（我现在不能给出一个有效的例子。）

有关更多信息，请点击以下链接。

---

尝试获取事件对象信息以检测并覆盖该行为。

您需要一个

反应本机手势处理程序
模块来
滑动

你可以跑

 yarn add react-native-gesture-handler

OR

npm install --save react-native-gesture-handler

和反应本机链接反应本机手势处理程序

更新您的
MainActivity.java
文件（或您创建
ReactActivityDelegate
实例的任何位置），使其覆盖负责创建
ReactRootView
实例的方法，然后使用此库提供的根视图包装器。不要忘记导入
ReactActivityDelegate
、
ReactRootView
和
RNGestureHandlerEnabledRootView
：

package com.swmandage.gesturehandler.react.example；
导入com.facebook.react.ReactActivity；
+导入com.facebook.react.ReactActivityDelegate；
+导入com.facebook.react.ReactRootView；
+导入com.swmandence.gesturehandler.react.rngesturehandler启用DrootView；
公共类MainActivity扩展了ReactActivity{
@凌驾
受保护的字符串getMainComponentName（）{
返回“示例”；
}
+@覆盖
+受保护的ReactActivityDelegate createReactActivityDelegate（）{
+返回新的ReactActivityDelegate（此，getMainComponentName（））{
+@覆盖
+受保护的ReactRootView createRootView（）{
+返回新的RNGestureHandlerEnabledRootView（MainActivity.this）；
+      }
+    };
+  }
}

请参阅您需要一个
反应本机手势处理程序
模块来
滑动

你可以跑

 yarn add react-native-gesture-handler

OR

npm install --save react-native-gesture-handler

和反应本机链接反应本机手势处理程序

更新您的
MainActivity.java
文件（或您创建
ReactActivityDelegate
实例的任何位置），使其覆盖负责创建
ReactRootView
实例的方法，然后使用此库提供的根视图包装器。不要忘记导入
ReactActivityDelegate
、
ReactRootView
和
RNGestureHandlerEnabledRootView
：

package com.swmandage.gesturehandler.react.example；
导入com.facebook.react.ReactActivity；
+导入com.facebook.react.ReactActivityDelegate；
+导入com.facebook.react.ReactRootView；
+导入com.swmandence.gesturehandler.react.rngesturehandler启用DrootView；
公共类MainActivity扩展了ReactActivity{
@凌驾
受保护的字符串getMainComponentName（）{
返回“示例”；
}
+@覆盖
+受保护的ReactActivityDelegate createReactActivityDelegate（）{
+返回新的ReactActivityDelegate（此，getMainComponentName（））{
+@覆盖
+受保护的ReactRootView createRootView（）{
+返回新的RNGestureHandlerEnabledRootView（MainActivity.this）；
+      }
+    };
+  }
}

请看
这是对我有效的解决方案，我认为它简单易行：

import { DrawerNavigator } from "../router/router";
import React, { Component } from "react";

export default class Drawer extends Component {
  state = {
    lockMode: "locked-closed"
  };
  render() {
    return (
      <DrawerNavigator
        screenProps={{
          drawerLockMode: this.state.lockMode
        }}
        onNavigationStateChange={(prevState, newState, action) => {
          if (
            action.type === "Navigation/MARK_DRAWER_SETTLING" &&
            !action.willShow
          )
            this.setState({ lockMode: "locked-closed" });
          if (
            action.type === "Navigation/MARK_DRAWER_SETTLING" &&
            action.willShow
          ) {
            this.setState({ lockMode: "unlocked" });
          }
        }}
      />
    );
  }
}

从“./router/router”导入{DrawerNavigator}；
从“React”导入React，{Component}；
导出默认类抽屉扩展组件{
状态={
锁定模式：“锁定关闭”
};
render（）{
返回(
{
如果(
action.type==“导航/标记\u抽屉\u结算”&&
！action.willShow
)
this.setState（{lockMode:“locked closed”}）；
如果(
action.type==“导航/标记\u抽屉\u结算”&&
威尔秀
) {
this.setState（{lockMode:“unlocked”}）；
}
}}
/>
);
}
}
这是一个适合我的解决方案，我认为它简单易行：

import { DrawerNavigator } from "../router/router";
import React, { Component } from "react";

export default class Drawer extends Component {
  state = {
    lockMode: "locked-closed"
  };
  render() {
    return (
      <DrawerNavigator
        screenProps={{
          drawerLockMode: this.state.lockMode
        }}
        onNavigationStateChange={(prevState, newState, action) => {
          if (
            action.type === "Navigation/MARK_DRAWER_SETTLING" &&
            !action.willShow
          )
            this.setState({ lockMode: "locked-closed" });
          if (
            action.type === "Navigation/MARK_DRAWER_SETTLING" &&
            action.willShow
          ) {
            this.setState({ lockMode: "unlocked" });
          }
        }}
      />
    );
  }
}

从“./router/router”导入{DrawerNavigator}；
从“React”导入React，{Component}；
导出默认类抽屉扩展组件{
状态={
锁定模式：“锁定关闭”
};
render（）{
返回(
{
如果(
action.type==“导航/标记\u抽屉\u结算”&&
！action.willShow
)
this.setState（{lockMode:“locked closed”}）；
如果(
action.type==“导航/标记\u抽屉\u结算”&&
威尔秀
) {
this.setState（{lockMode:“unlocked”}）；
}
}}
/>
);
}
}
这有点帮助，但我仍然不知道如何动态更改
抽屉锁模式。不要使用它。您不能使用isDrawerOpen布尔值检查它是否已打开并标识抽屉的当前状态吗？很抱歉，我不能提供一个示例。你是说在
createDrawerNavigation
中？是的，请尝试查看它不会那样工作，因为它只调用了一次。这有点帮助，但我仍然不知道如何动态更改
drawerLockMode
。不要使用它。您不能使用isDrawerOpen布尔值检查它是否已打开并标识抽屉的当前状态吗？我很抱歉