如何使用Swiper.js获取幻灯片的先前活动索引?

特诺马迪曼

我可以使用来获取当前幻灯片的索引this.realIndex,如文档中所示,但this.previousIndex无法产生先前活动幻灯片的realIndex。相反,它提供的等效于activeIndex,当滑块循环时会反映出来。如何获得realIndex以前活动的幻灯片的图片?这是Swiper中的错误吗?这可能需要进入本地存储吗?

这是我的笔,将幻灯片索引记录到控制台。注意previousIndex没有什么用:https : //codepen.io/thenomadicmann/pen/GRRPeWG?editors=1111

特诺马迪曼

@neevany离得很近,让我走上了正轨。但是,对于希望使用slideChange事件访问循环的Swiper中的previousIndex的任何人,您不仅需要纠正他描述的-1索引问题,还需要纠正在swwiper循环时发生的double slideChange事件。代码如下:

// Have to use previousIndex in this fashion due to a bug in Swiper.js as of 11/21/19
let previousIndex = this.previousIndex - 1;
if ( previousIndex == -1 ) {
    previousIndex = 0;
} else if ( previousIndex == document.querySelectorAll( '.swiper-slide' ).length ) { // When swiper loops, slideChange gets fired twice and messes up animations. This prevents it from doing so.
    return;
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

更改幻灯片后,如何获取当前幻灯片的索引?

如何检测swiper js中的当前幻灯片?

如何检测swiper js中的当前幻灯片?

如何在光滑的幻灯片中获取上一张幻灯片索引

Swiper.js 垂直幻灯片无法使用 ngx-swiper-wrapper

如何使用JS制作幻灯片

如何通过单击 swiper.js 中的所需幻灯片来更改居中幻灯片?

如何使用Swiper库在Ionic2中创建幻灯片/转盘

Swiper - 移动幻灯片

无法获取活动幻灯片的索引

Ionic 2幻灯片组件-如何访问Swiper API

幻灯片到达末尾时,如何在swiper.js中的容器中添加类?

如何限制幻灯片的大小(JS)

swiper js 每个视图多张幻灯片

如何显示特定幻灯片的活动幻灯片编号

使用JS数组的幻灯片放映

离子4离子幻灯片使用ngClass更改活动幻灯片的CSS样式

如何使用react-native-snap-carousel在React native中获取和传递活动幻灯片的详细信息

如何根据活动幻灯片更改身体背景颜色?

如何定位自举轮播的活动幻灯片?

如何获取部分中第一张幻灯片的幻灯片编号?

如何获取Google幻灯片标题和幻灯片编号的列表-Google Apps脚本

使用多个滑块获取当前幻灯片和总幻灯片

如何在Glide.js中获取当前幻灯片编号

如何在reveal.js中获取堆叠幻灯片的数量

如何为使用JS创建的幻灯片创建动画?

jQuery Swiper幻灯片高度

Swiper:将自定义幻灯片设置为活动

使用swiper js创建一个历史时间表,每年有多张幻灯片