将匿名函数传递给onPanResponderMove

Question

我有一个javascript问题,我不知道如何解决它.

在我的React Native应用程序中,我有一个panResponder,我正在使用这个钩子来调用Animated.event.

this.panResponder = PanResponder.create({
    /* ... some other methods ... */
    onPanResponderMove: Animated.event([null, { dx: this.state.x, dy: this.state.y }]),
});

虽然,我希望钩子是一个匿名函数,以便能够做一些其他的事情.我尝试了一些不同的方式来使用匿名函数,但我不能让它工作.

this.panResponder = PanResponder.create({
    /* ... some other methods ... */
    onPanResponderMove: (event, gestureState) => {
        this.callSomething(); 
        return Animated.event([null, { /* I'm not sure what to pass here to map with gestureState... */ }]);
    },
});

我已经阅读了文档,但即便如此,我仍然不知道.

你能帮我吗？

谢谢.

更新:

我终于做了类似的事情:

let valueY;
this.panResponder = PanResponder.create({
    /* ... some other methods ... */
    onPanResponderGrant: () => {
        valueY = this.state.y._value;
    },
    onPanResponderMove: (event, gestureState) => {
        this.callSomething();
        let panY = valueY + gestureState.dy;
        this.state.y.setValue({ y: panY });
    },
});

我不认为这是最好的方式,但...

Answer 1

问题是Animated.event(...)实际上正在返回一个函数,所以要立即调用它,你必须做这样的事情:

this.panResponder = PanResponder.create({
  ...
  onPanResponderMove: (e, gestureState) => {
    // custom logic here
    ...

    Animated.event([null, {
      dx: this.state.pan.x,
      dy: this.state.pan.y,
    }])(e, gestureState); // <<--- INVOKING HERE!
  },
});

Answer 2

如果这对任何人都有用,我就会遇到同样的问题.我最后得到了:

let mover = Animated.event([ null, { dy: this.state.pan.y }]) ;
let repsponder = PanResponder.create({
    ....
    onPanResponderMove: (e, gesture) => {
        this.doSomething() ;
        return mover(e, gesture) ;
        },
    }) ;

重要的一点似乎是在onPanResponderMove代码之外调用Animated.event.请注意,在通常出现的示例中,代码是onPanResponderMove:Animated.event(...)因此创建了一个Animated.event 函数,但如果你在onPanResponderMove代码中(如在alexmngn的第一次尝试中),则为新的在onPanResponderMove代码的每次调用中创建的东西(不管它是什么!)- 我猜是问题所在.