React-native-deck-swiper: Swiper goes back to previous card every time setState() is called

Created on 6 Feb 2018  路  10Comments  路  Source: alexbrillant/react-native-deck-swiper

There's already a closed issue for this, I don't know why since this issue is still present in the component, every time a modal shows up in the screen the cards reset for some reason.

EDIT: it doesn't reset, it just goes back to the previous card.

EDIT 2: it happens every time a setState() is called.

Most helpful comment

I used a work around, i just set a state in my component which save the current index and use this index as initial cardIndex.
So even if it reset, it reset at the actual index.
(Had to move on an other project so i couldn't debug further)

All 10 comments

This is solved in version 1.4.8

I still have this issue. When i setState (any state) in my parent component, the Swiper child component just reset the active card to the index 0

Are you sure you are using the latest version of this module?

Reopened the issue, I was using the 1.4.8 version and out of nowhere it started doing the exact same thing. I even updated to 1.5.15 and is still doing the same.

@zelgan90 Sorry for the late answer didn't seen your previous message.
I'm using 1.5.15. But apparently you have the same issue now :)

@QQizi Did you solve it?

I used a work around, i just set a state in my component which save the current index and use this index as initial cardIndex.
So even if it reset, it reset at the actual index.
(Had to move on an other project so i couldn't debug further)

@QQizi Solution works on iOS, but unfortunately not on Android.

I am having the same issue. But luckily @QQizi workaround work for Android and iOS for me.

@zelgan90 @QQizi @simdonl @collaorodrigo7
This is the intended behaviour. Whenever the swiper receives new props, the card indexes are computed. If the first card index is not available it is set to 0 (the 1st card).

Therefor, if you keep state in a parent component that contains the swiper, and you modify the state, the swiper will get a _componentWillReceiveProps_ event which will reset the cardIndex.

There's two solutions for this:

  1. The one mentioned by @QQizi above
  2. Make sure that the swiper doesn't receive new props after the initial render (but this is almost impossible in a real application scenario).

PS: even when we switch from _componentWillReceiveProps_ to _getDerivedStateFromProps_ the same logic and flow will happen.

Was this page helpful?
0 / 5 - 0 ratings