React native：this.touchableHandleResponderGrant 不是一个函数

Question

我正在尝试通过使用 React Native PanResponder. I looked at this tutorial 实现一个简单的拖动功能，但我正在做一个更简单的事情，它只会在拖动时改变状态变量。

componentWillMount() {
    this._panResponder = PanResponder.create({
        onMoveShouldSetResponderCapture: () => true,
        onMoveShouldSetPanResponderCapture: () => true,
        onPanResponderGrant: (e, gestureState) => {
            //this.setState({pan: 0});
            console.log('grant');
        },

        onPanResponderMove: (e, gestureState) => {
        //this.setState({pan: gestureState.dx});
        console.log(gestureState);
        },
        onPanResponderRelease: (e, {vx, vy}) => {
        }

    });
    console.log('pan init');
}

在我的渲染函数中我有这个：

<Text {...this._panResponder.panHandlers}>Drag here</Text>

但是当我 pan/drag 我收到一个带有错误的红框：

this.touchableHandleResponderGrant is not a function

我做错了什么？

Answer 1

我猜 panHandlers 道具只能与 View 或 Animated.View 组件一起使用。

<View {...this._panResponder.panHandlers}>
  <Text>Drag here</Text>
</View>

或

<Animated.View {...this._panResponder.panHandlers}>
  <Text>Drag here</Text>
</Animated.View>

React native：this.touchableHandleResponderGrant 不是一个函数

React native: this.touchableHandleResponderGrant is not a function

javascript

pan

drag

react-native