2016-04-15 4 views
11

У меня проблема с javascript, и я не уверен, как ее разрешить.Передайте анонимную функцию onPanResponderMove

В моем приложении React Native у меня есть panResponder, и я использую этот hook для вызова 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... */ }]); 
    }, 
}); 

Я прочитал документацию, но даже с этим я до сих пор не знаю.

Можете ли вы мне помочь?

Спасибо.

Update:

Я наконец-то сделал что-то вроде этого:

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 }); 
    }, 
}); 

Я не думаю, что это лучший способ сделать это, хотя ...

+0

Что именно проблема? Синтаксис второй версии выглядит отлично. Есть ли реальная ошибка? Вызывается функция? «не может заставить его работать» слишком расплывчато. – rooftop

+0

Синтаксис просто не работает без каких-либо ошибок, когда я пытаюсь переместить его, просто больше не движется – alexmngn

ответ

8

В случае это полезно для всех, у меня была одна и та же проблема. Я закончил с, грубо:

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

Важный бит, кажется, называть Animated.event вне кода onPanResponderMove. Следует отметить, что в примерах, которые обычно появляются, код onPanResponderMove: Animated.event (...) так один Animated.event вещь получает создан, но если он внутри onPanResponderMove кода (как в alexmngn годах первая попытка), новая вещь (независимо от того, что она есть!) создается при каждом вызове кода onPanResponderMove, который, как я предполагаю, является проблемой.

+1

Да, сэр, это немного поцарапало мою голову на этом. Спасибо. – Soheil

23

Дело в том, что 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! 
    }, 
}); 
+1

отличный ответ, спасибо! – Laker

+2

Гений! Хотелось бы, чтобы я понял базовые функции так же хорошо, как и вы. Прекрасно работает. –

Смежные вопросы