voronianski/react-swipe

ReactSwipe resets when the parent component updates

davehill1900 opened this issue · 2 comments

When the parent component containing the <ReactSwipe/> updates due to state change, <ReactSwipe/> also updates and resets back to first slide, although the changing state has no effect on <ReactSwipe/>.

Is there a way to persist the current slide when the parent component updates?

Here is the CodeSandbox example.

If you press next and change to 2nd slide screen and then hit the State Update button, which only increase a number, you will see that the Slider resets and goes back to first slide.

What I am trying to do is store the position of the slider upon change and pass it as a prop to another component, but this is not illustrated here in this example code.

Don't know if this will help but I was able to skirt this issue by keeping track of the currentIndex using the callback and setting the swipeOptions: {{startSlide : this.state.currentIndex}}. That way when it re-rendered it knew what slide to start on

Due to the way React works, it will of course re-render after a state change, and unless you specify the startSlide as mentioned above, the internal state will simply reset on the re-render lifecycle event.

So as @mregan59 mentioned, the solution is to track the state yourself.