Javascript 当幻灯片更改时，如何获取当前幻灯片的索引？

我有以下几点

mySwiper = new Swiper('.my-swiper', {
    direction: 'vertical',
    loop: true,
});
mySwiper.on('slideChange', function () {
    console.log('*** mySwiper.realIndex', mySwiper.realIndex);
});

---

但是

realnex

总是返回上一个索引。因此，如果我在第一张幻灯片（0）上，转到下一张幻灯片，

realdex

应该是1时，它是0。当我回到第一张幻灯片时，

realIndex

应该是0，而它是1。因此，事件似乎在索引更新之前触发。我尝试过其他项目，但没有任何运气。是否有一个事件在幻灯片更改后触发，以便我可以捕获当前幻灯片索引？

根据API，有一个事件

slideChangeTransitionEnd

，它“…将在动画播放到其他幻灯片（下一张或上一张）”后触发。这听起来像是一个很有希望的事件，可以尝试而不是

slideChange

---

您应该使用

transitionEnd

事件，因为事件将在转换后激发

请参见下面的演示

var mySwiper=new Swiper（“.Swiper container”{
方向：'垂直'，
循环：对，
});
mysweer.on（'transitionEnd'，function（））{
console.log（'***mysweer.realdex'，mysweer.realdex）；
});
.swiper容器{
宽度：100%；
身高：100%；
}
.作为控制台包装{
z指数：999999！重要；
}
.滑梯{
文本对齐：居中；
字号：18px；
背景：#fff；
/*将幻灯片文本垂直居中*/
显示：-网络工具包盒；
显示：-ms flexbox；
显示：-webkit flex；
显示器：flex；
-webkit盒包：中心；
-ms-flex-pack:center；
-webkit内容：中心；
证明内容：中心；
-webkit框对齐：居中；
-ms-flex-align：居中；
-webkit对齐项目：居中；
对齐项目：居中；
}

幻灯片1
幻灯片2
幻灯片3
幻灯片4
幻灯片5
幻灯片6
幻灯片7
幻灯片8
幻灯片9
幻灯片10
我不熟悉Swiper，但是否有可能将事件对象传递给
slideChange
侦听器，告诉您想要什么，比如
mysweer.on（'slideChange'，function（event）{…
？添加了一个答案，看看是否有帮助