How to stop the spread of touch events in React-Native

Question

I have a scrollview with an image grid when I click on the image id for a long time to stop distributing mouse events to scrollview and just track the movement. With the intention of reinitializing press distribution. Does anyone know how?

Answer 1

You should take a look at the Gesture Responder methods: https://facebook.imtqy.com/react-native/docs/gesture-responder-system.html#responder-lifecycle . Actually an even simpler way is to take a look at PanResponder https://facebook.imtqy.com/react-native/docs/panresponder.html - first look at the UIExplorer example to see it in action: https://github.com/ facebook / react-native / blob / master / Examples / UIExplorer / ResponderExample.js . I'm not sure though if this will handle your long press yours?

Answer 2

I solved this problem by wrapping my press event with a class method that set the internal variable to true, then executed the original logic and set the internal variable to false again after its completion. You can then wrap the container component's event handler to see if the internal variable is set to true or false. eg:

<TouchableOpacity onPress={this.doSomething1}> <TouchableOpacity onPress={this.doSomething2}> <Image ... /> </TouchableOpacity> </TouchableOpacity> doSomething1() { this.preventDefault = true; doSomeLogic(); this.preventDefault = false; } doSomething2() { if(!this.preventDefault) { } }