react-native 手势移动与点击事件冲突解决办法

用手势时，TouchableOpacity 不起作用，开始没有思路，网上找的解决办法是搞两个手势的View，然后通过手势的捕获、传递解决，看了看感觉有点麻烦，于是自己做了另外一个更简单的方法，如下图:

原理很简单，就是判断是否是正在移动，根本用不到 TouchableOpacity 这个组件

相关代码:

    UNSAFE_componentWillMount() {
        let imgHalfWidth = 45
        this._panResponderMove = PanResponder.create({
            // 要求成为响应者：
            onStartShouldSetPanResponder: (evt, gestureState) => true,
            onStartShouldSetPanResponderCapture: (evt, gestureState) => true,
            onMoveShouldSetPanResponder: (evt, gestureState) => true,
            onMoveShouldSetPanResponderCapture: (evt, gestureState) => true,

            onPanResponderGrant: (evt, gestureState) => {
                this.isMove = false
            },

            onPanResponderMove: (evt, gestureState) => {
                console.log('gestureState===>>', evt.nativeEvent.pageX)
                this.state.position.setValue({
                    x: evt.nativeEvent.pageX - imgHalfWidth,
                    y: evt.nativeEvent.pageY - imgHalfWidth,
                })
                this.isMove = true
            },
            onPanResponderTerminationRequest: (evt, gestureState) => true,
            onPanResponderRelease: (evt, gestureState) => {
                console.log('onPanResponderRelease====>>', evt.nativeEvent.pageX, evt.nativeEvent.pageY)
                // this._limitArea(evt, gestureState, imgHalfWidth)

                if(!this.isMove){
                    console.log('这是点击-----跳转到详情页===>>>')
                }
            },

            onPanResponderTerminate: (evt, gestureState) => {
            },

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





                <Animated.View style={{
                    width: dp(90),
                    // height: dp(120),
                    position: 'absolute',
                    top: dp(0),
                    left: dp(0),
                    zIndex: 999,
                    alignItems: 'center',
                    transform: [
                        {translateX: this.state.position.x},
                        {translateY: this.state.position.y},
                    ]
                }}
                               {...this._panResponderMove.panHandlers}
                >
                    <Image source={require('../../images/nined/content_ic_activity.png')}
                           style={{width: dp(82), height: dp(82)}}/>
                    <Image source={require('../../images/nined/content_ic_button.png')}
                           style={{width: dp(54), height: dp(17), top: -10}}/>
                </Animated.View>