react-swipeable-views
react-swipeable-views copied to clipboard
Changing index does not always switch to that index in render
Setting the index prop to the previous value does not switch rendered index. Upon re-renders of the SwipeableViews component, if the previous render's index value is the same, nothing happens. Even if the user interacted with the component between renders and thus the index has changed.
- [x] I have searched the issues of this repository and believe that this is not a duplicate.
Expected Behavior
Updating the index prop on a re-renders of SwipeableViews should always change the view to that slide.
Current Behavior
The view only changes to the specific index based on previous index values. Sometimes different values do not cause a slide change when it should.
Steps to Reproduce (for bugs)
Demo: https://codesandbox.io/s/material-demo-yrfvv
- Set the initial
indexprop toundefined. First render is on index 0 as expect. - Interact with the slider to go to a different index. In the demo swipe to slide 3.
- Cause an event which re-renders the
SwipeableViewscomponent, now setindexto1. In the demo click theGo back to the first slidebutton - Component should animate back to index 0. Instead nothing happens on the re-render.
If you change the setIndex(0) call to 1 instead of 0 in my demo, it will correctly go to that slide, however only once. This appears to relate to not being able to go to the index value of the previous render.
Context
In my application I'm attempting to go "back" to the initial slide if something happens asynchronously. However due to this bug I'm having to side step it by unmounting the component then re-rendering it, which makes me lose the slick animation unfortunately.
Your Environment
| Tech | Version |
|---|---|
| react-swipeable-views | 0.13.3 |
| React | 16.10.2 |
| platform | browser |
I don't think this is a mistake at all. To do this you can use onChangeIndex to control the change of the slide. As in this example.
https://codesandbox.io/s/swipeableviews-back-first-slide-forked-exgwk