react-native - React Native panResponder onRelease 事件窃取可触摸不透明度 onpress 事件

标签 react-native react-native-ios

看起来 React Native panResponder onRelease 事件正在窃取可触摸的不透明度 onpress 事件。

可触摸不透明度的 onpressin 和 onpressout 事件仍然正确触发,但 onpress 事件仅在平移响应器上的 onrelease 事件未触发时触发(此问题仅发生在 ios 上,在 android 上完美运行)。 可触摸不透明度的文档表明,如果响应者窃取触摸,则不会调用 onpress,但我不知道如何让它停止窃取简单按下的触摸。

这是我的代码的简化版本:

const panResponder = useMemo(() => {
    return PanResponder.create({
      onMoveShouldSetPanResponder: () => true,
      onPanResponderGrant: (evt, gestureState) => {
        dostuff()
      },
      onPanResponderMove: (evt, gestureState) => {
       dostuff()
      },
      onPanResponderRelease: (evt, gestureState) => {
        dostuff()
      },

      onShouldBlockNativeResponder: () => {
        return true;
      },

return (
    <View {...panResponder.panHandlers} style={[styles.view, style]}>
      <Button 
onPress={() => {
         //not logging
         console.log('Onpress firing")}

} onPressIn={() => {
        //getting logged
        console.log('Onpressin firing')
}} onPressOut={() => {
        //getting logged
        console.log('Onpressout firing')
}}
/>
    </View>
  );

最佳答案

似乎在 iOS 上 onMoveShouldSetResponder 被调用的边距比在 Android 上更小,导致即使您的手指移动少量,它也会被调用。我通过这样做成功修复了它。

      onMoveShouldSetPanResponder: (evt, {dx, dy}) => {
        if (dx > 0 || dy > 0) {
          return true;
        }

        return false;
      },

关于react-native - React Native panResponder onRelease 事件窃取可触摸不透明度 onpress 事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/68377590/

相关文章:

ios - 异常 'Call must be made on main thread' iOS

xcode - 如何将EXPO项目弹出到 native 代码

react-native - websocket 与 Android 应用程序的连接

javascript - 如何使用 react-native 和 javascript 在应用程序的主页中添加弹出窗口?

android - React Native Android - 初始化失败

android - 如何在 react-native 中获取子组件的引用?

ios - Xcode10 无法构建和运行 React Native

reactjs - 如何将拖动 View 绑定(bind)到ScrollView项目中?

IOS 构建从 TestFlight 中消失

javascript - 当使用 fetch、axios 等时,.`catch` 不会处理错误,而是您的应用程序崩溃