Jiahonzheng's Blog

解决 react-native-swiper 翻页错乱问题

字数统计: 137阅读时长: 1 min
2018/04/26 Share

react-native-swiper 是一款出色的 Swiper 组件。

问题

一开始,使用静态的数据没有问题,但是使用动态加载的数据(数组)就出现问题,经过调试发现,可能是组件对数据源的长度“捕捉”不到位,导致的 index 异常。

相关 Issues

解决方法

Swiper 添加 key 参数,并将其设置为数据源(数组)的 length

1
2
3
4
5
6
7
8
<Swiper
autoplay={true}
loop={true}
key={this.state.list.length}
autoplayTimeout={2}
>
{this.renderItem()}
</Swiper>
CATALOG
  1. 1. 问题
  2. 2. 相关 Issues
  3. 3. 解决方法