React-native-deck-swiper: 'jumpToCardIndex' doesn't work when called from the function that is called on onSwipedRight/onSwipedLeft events

Created on 18 Jul 2017  路  8Comments  路  Source: alexbrillant/react-native-deck-swiper

I want the swiper to render previous card on rightSwipe. I have a method(renderPreviousCard) that is called when 'onSwipedRight' event is fired. In renderPreviousCard function 'jumpToCardIndex' is used with swiper's reference. 'jumpToCardIndex' is not working.

<Swiper
              infinite={true}
              cardIndex={0}
              showSecondCard={false}
              cardVerticalMargin={0}
              cardHorizontalMargin={0}
              verticalSwipe={false}
              cards={this.state.demoArray}
              renderCard={(card) => this.renderCardMethod(card)}
              onSwiped={(cardIndex) => {console.log(cardIndex)}}
              onSwipedAll={() => {console.log('onSwipedAll')}}
              backgroundColor={'white'}
              onSwipedRight={(cardIndex) => this.renderPreviousCard(cardIndex)}
              ref={(ref) => {this.swiperReference = ref}}>
</Swiper>
renderPreviousCard = (cardIndex) =>{
      this.swiperReference.jumpToCardIndex(cardIndex-1);
    }

NOTE: The 'jumpToCardIndex' is working in other scenarios. Whenever the 'jumpToCardIndex' method is within the scope of functions called from the swiper props/events.

Most helpful comment

fixed in 1.3.0
https://github.com/alexbrillant/react-native-deck-swiper#swipe-back-to-previous-card-props

All 8 comments

+1

So What happens now when you swipeRight?
And try use cardIndex-2

When I swipeRight next card is rendered. No matter whether I swipeRight/ swipeLeft, next card is rendered, just like Tinder. In other words I cannot see the card once it is swiped(infinite loop disabled). I want to be able to render previous card on Right swipe and next card on Left swipe. I want Tinder like animation and simple swiper where I can traverse over the array of cards in forward and reverse direction.
I have used (cardIndex-2) and also tried giving hard coded index. But the function jumpToCardIndex isn't working all the same.

I would also like to do the same thing, has anyone got this to work?

@alexbrillant any plans on fixing this in the next day or two, I have a developer milestone I need to meet and want to know if I should wait or look for another solution/package?

I have fixed it. I will make pull request to @alexbrillant by Monday.

Has this been fixed and published/merged?

fixed in 1.3.0
https://github.com/alexbrillant/react-native-deck-swiper#swipe-back-to-previous-card-props

Was this page helpful?
0 / 5 - 0 ratings