在vue项目中使用swiper遇到的坑

在vue项目中使用swiper自动轮播时次轮点击效果会失效

解决方案:
在vue的data中的swiper配置项swiperOption: {}中监听onclick事件,代码如下:
data() {
return {
swiperOption: {
pagination: {
el: “.swiper-pagination”,
clickable: true
},
autoplay: {
disableOnInteraction: false
},
loop: true,
slidesPerView: “auto”,
centeredSlides: true,
spaceBetween: 5,
on:{
click:(swiper)=>{
console.log(swiper.target)
//业务代码
}
}
}
}
}
在这个click事件中监听事件触发源然后执行自己业务逻辑做相应的处理。

你可能感兴趣的:(在vue项目中使用swiper遇到的坑)