Unable to update original position

[AnsonSavage]

I think this may be related to this issue: https://github.com/tongyy/react-native-draggable/issues/89 . I am also seeing if there is any feedback on StackOverflow.

By setting the shouldReverse prop to true, the draggable item smoothly returns to its original position.

However, I can't seem to dynamically update the "original position" of the draggable item by updating the position.x and position.y values, as in the following code:

    <View style={styles.answerContainer}>
        {answerParts.map((item, index) => (
            <Draggable
                key={item.index}
                x={item.position.x}
                y={item.position.y}
                disabled={item.placed}
                shouldReverse={!item.placed}
                onDragRelease={(event) => onReleaseItem(item, event)}
            >
                <View style={styles.draggableItem}>
                    <Text style={styles.draggableText}>{item.text}</Text>
                </View>
            </Draggable>
        ))}
    </View>

Any thoughts on how I can properly change the original location of a draggable React Native component?

Thanks!

[flyskywhy]

Or ref to https://github.com/tongyy/react-native-draggable/issues/89#issuecomment-866661713

key={'x' + item.position.x + 'y' + item.position.y + 't' + this.state.dragTime}
onDragRelease={(event, gestureState, bounds) => this.setState({dragTime: new Date().getTime()})}

Or for "smoothly returns", need hack to onDragRelease(e, gestureState, getBounds(), pan) in node_modules/react-native-draggable/Draggable.js then

key={item.index}
onDragRelease={(event, gestureState, bounds, pan) => Animated.spring(pan.current, {
    toValue: {x: 0, y: 0},
    useNativeDriver: false,
  }).start();
}

[ARSSHEIKH]

Or ref to #89 (comment)

key={'x' + item.position.x + 'y' + item.position.y + 't' + this.state.dragTime}
onDragRelease={(event, gestureState, bounds) => this.setState({dragTime: new Date().getTime()})}

Or for "smoothly returns", need hack to onDragRelease(e, gestureState, getBounds(), pan) in node_modules/react-native-draggable/Draggable.js then

key={item.index}
onDragRelease={(event, gestureState, bounds, pan) => Animated.spring(pan.current, {
    toValue: {x: 0, y: 0},
    useNativeDriver: false,
  }).start();
}

pan is not returning from onDragRelease there are just event, gestureState, bounds

[flyskywhy]

Or ref to #89 (comment)

key={'x' + item.position.x + 'y' + item.position.y + 't' + this.state.dragTime}
onDragRelease={(event, gestureState, bounds) => this.setState({dragTime: new Date().getTime()})}

Or for "smoothly returns", need hack to onDragRelease(e, gestureState, getBounds(), pan) in node_modules/react-native-draggable/Draggable.js then

key={item.index}
onDragRelease={(event, gestureState, bounds, pan) => Animated.spring(pan.current, {
    toValue: {x: 0, y: 0},
    useNativeDriver: false,
  }).start();
}

pan is not returning from onDragRelease there are just event, gestureState, bounds

That's why I mean "hack", you can modify Draggable.js to add pan be returned in onDragRelease.