Pagnization does not work with dynamic components

Which OS ?

iOS

Version

Which versions are you using:

• react-native-swiper v1.5.6
• react-native v0.49

Expected behavior

Pagnization dots indicate current swipe-item’s index

Actual behavior

only the first dot is highlighted

I have tried to use a few hard-coded mock CardResume and the paganization works fine with correct indication, but once I switch to using map the paganization indicators stopped working

  ```
   <Swiper
      style={{}}
      height={height*0.7}>

      {this.state.resumeList.map((resumePreview, index) => {
        this.fakedata.resumeName = resumePreview.headline
        return (
          <CardResume 
            key={index}
            style={{margin: "5%"}}
            data={this.fakedata}
            onPress={() => this.props.navigation.navigate('Details', { resumeID: resumePreview.profile_id })}
          />
        )
      })}
    </Swiper>

[joe-lz]

I did just like this and it works fine

[aaronSig]

It looks like the problem is the swiper component isn’t resetting when the slides change.

Setting the key on the swiper to change (e.g. key={images.length}) when the underlying array changes also fixes this:

 <Swiper key={images.length}>
          {images.map(image => (
                 <Image source={image} />
          ))}
</Swiper>