leecade / react-native-swiper

The best Swiper component for React Native.
MIT License
10.37k stars 2.35k forks source link

Swiper on button click jumps 2 slides #862

Open lXSPandora opened 5 years ago

lXSPandora commented 5 years ago

Which OS ?

ios and android

Version

Which versions are you using:

Expected behaviour

On click the button go to the next slide

Actual behaviour

When i click to the button on the first time it jumps to the same slide again

How to reproduce mit>

To help us, please fork this component, modify one example in examples folder to reproduce your issue and include link here.

Steps to reproduce

  1. yarn add react-native-swiper
  2. Create a component like this
  3. <Swiper
    height={140}
    showsButtons
    >
    <Text>Slide 1</Text>
    <Text>Slide 2</Text>
    </Swiper>

    4.Click on the button to go to the next slide

kapture 2018-09-18 at 1 17 40

qsg1215 commented 5 years ago

me to

tibbis commented 5 years ago

same here. Anyone found a workaround?

developersHomefriend commented 5 years ago

same here

JayceTsien commented 5 years ago

solved on this https://github.com/leecade/react-native-swiper/issues/720

JayceTsien commented 5 years ago

add the key to the Swiper componet like this:

<Swiper
        key={this.state.productImages.length}  // focus
        style={styles.swiper}
>
        {swiperItems}
</Swiper>

or like this:

const swiperItems = this.state.productImages.map(item => {
        return(
                <Image 
                        source={{uri: item.realpath}}
                        style={styles.swiperimage}
                        key={item.position}  // focus
                />
        )
})
HighSoftWare96 commented 5 years ago

720