Nativebase: How to access the current item in Deckswiper

Created on 16 Jul 2017  路  1Comment  路  Source: GeekyAnts/NativeBase

I would like to change images dynamically using Deckswiper based on the content of the currently showing item.While this works fine with onSwipe events, I would like to change the image based on the content of the currently showing card. The problem is swipe events return this info after the fact whereas I need the state of the current card.

How do I access the currently showing card with Deckswiper?

Is there an existing method to achieve this?

native-base: 2.1.5, react: 16.0.0-alpha.12, react-native:0.45.1

//Javascript
 switchImage(currentCard) {

         if(currentCard.description === "One") {
         this.setState({image:require('./img/bg1.png')});
       } else if(currentCard.description === "Two") {
          this.setState({image:require('./img/bg2.png')});
       }else if(currentCard.description === "Three") {
          this.setState({image:require('./img/bg3.png')})
       }

    } 

//Views
 <View style={{marginLeft:10,marginRight:10,marginTop:'90%'}} >
                    <DeckSwiper
                        ref={(deck) => this.deck = deck}
                        dataSource={cards}
                         onSwipeRight={this.switchImage}     
                        renderItem={item =>

                            <Card>
                       //Trimmed Content
                          </Card>

                        }
                        />
                        </View>

Most helpful comment

@anesumuz this.deck._root.state has some properties like selectedItem and cardItem, which you can use for this.

>All comments

@anesumuz this.deck._root.state has some properties like selectedItem and cardItem, which you can use for this.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

bsiddiqui picture bsiddiqui  路  3Comments

agersoncgps picture agersoncgps  路  3Comments

inv2004 picture inv2004  路  3Comments

nschurmann picture nschurmann  路  3Comments

sihemhssine picture sihemhssine  路  3Comments