vue的swiper组件使用,获取当前滑动位置activeIndex

Posted vieber

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue的swiper组件使用,获取当前滑动位置activeIndex相关的知识,希望对你有一定的参考价值。

使用vue版的swiper组件vue-awesome-swiper,这个是最好用的,并且api和swiper基本一致。

使用的时候需要拿到滑动之后当前的index。

要获取activeIndex这个值。

错误写法


官方文档这么写有问题,我在全局引入的时候这样根本拿不到。

正确写法

this.$refs.mySwiper.swiper

这样写才可以。

然后监听@slideChange="slideChange"slideChange事件,在这个事件里面

this.$refs.mySwiper.swiper.activeIndex

这样获取activeIndex,这样就知道了当前是处于哪个index了。

参考文档

  • https://github.com/surmon-china/vue-awesome-swiper

以上是关于vue的swiper组件使用,获取当前滑动位置activeIndex的主要内容,如果未能解决你的问题,请参考以下文章

swiper.js中怎么获取滑动前后的位移值?

在Vue中使用了Swiper ,动态从后台获取数据的之后,swiper滑动失效??

微信小程序获取轮播图当前图片下标滑动展示对应的位数点击位数展示对应图片

swiper组件怎么修改切换动画 让每一次滑动的切换效果都不一样?

swiper插件中,移动端左右滑动的事件是啥,求解答

vue滑动条组件封装