Question

为了了解Animated API和PanResponder，我创建了一个组件，允许用户向左或向右拖动FlatList中的每个列表项以触发操作（类似于谷歌收件箱应用程序）

我遇到的问题是，由于FlatList被立即触发，这似乎会覆盖PanResonder中的滚动。作为临时解决方案，我更新了我的代码，以便用户需要从屏幕边缘拖动手指以触发PanResponder。（这不太理想）

是否有可靠地确定用户操作是否比Y更多X并且在这种情况下仅触发PanResonder，否则允许像往常一样滚动？

以下PanResponder的代码:(我没有包含onPanResponderRelease的代码，因为它不相关）

this.panResponder = PanResponder.create({

    onStartShouldSetPanResponder: (evt, gestureState) => true,

    onPanResponderTerminationRequest: () => false,

    onPanResponderGrant: (e, gestureState) => {

        if(gestureState.x0 < sideSwipeThresh || gestureState.x0 > this.screenWidth - sideSwipeThresh) {
            this.swipedFromEdge = true;
        } else {
            this.swipedFromEdge = false;
        }

        if(this.swipedFromEdge){
            if(isPanning){
                this.props.isPanning(true)
            }
        }

    }

});

Answer 1

很久以前我遇到过类似的问题，但不幸的是我不记得我是如何解决它的。我想我所做的是实现onMoveShouldSetPanResponder并检查dx或dy中的滑动是否超过某个阈值。因此，您可以在onMoveShouldSetPanResponder中跟踪dx和dy，并根据dx和dy授予平移响应者或平板列表来处理触摸。我希望这可以帮助你解决问题，自从我接触到RN以来已经有一段时间了。

React Native Pan Responder X Axis vs Scroll

1 个答案: