React Native passing Component/Object property to OnPress function

user_8998474 0
Viewed 548

Just started learning React Native and running into some basic issues. I am using the React-native-draggable component, and I would like to use the position of the element to update the state of my current scene. 

<Draggable renderColor='white' offsetX={0} renderSize={48} reverse={false} pressDragRelease={PASS X,Y POSITION TO A FUNCTION HERE?}>

For the life of me I can not get this to work; I really just want to get the x and y position of the Draggable element that is released, and use that in this.setState( ... ). I've tried binding, but really I'm a complete beginner and don't even know where to look right now. Any pointers would be greatly appreciated.

react-native reactjs draggable ecmascript-6 javascript
1 Answers

This is not possible at the moment. By taking a quick look at the module source code, you can see here that the pressDragRelease function is called without any parameters.

onPanResponderRelease: (e, gestureState) => {
    if(pressDragRelease)
        pressDragRelease();
[...]

What we want here is to get x and y from gestureState. We can pass onPanResponderRelease params to pressDragRelease:

onPanResponderRelease: (e, gestureState) => {
    if(pressDragRelease)
        pressDragRelease(e, gestureState);
[...]

Feel free to fork and submit a pull request!

Update

I've made a PR here: https://github.com/tongyy/react-native-draggable/pull/7

Update 2

The PR has been merged and a new version of the module published to npm!

npm install react-native-draggable@1.0.8

Admin1
Related