vue中swiper开启loop后,点击事件不响应的解决方案_vue.js_

swiperOptions: {                 pagination: {                     el: '.swiper-pagination'                 },                 loop: true,                 autoplay: 5000,                 speed: 950,                 observer: true,                 // 修改swiper自己或子元素时，自动初始化swiper                 observeParents: true                 // Some Swiper option/callback...             },

videoPlay(list){             //将点击时获取的的banner图的序列号转为数组的索引值             let inx = list-1             //当序列号是0的时候判为数组的最后一位             if(list == 0 ){                 inx = this.bannerArr.length-1             //当序列号是大于数组1的时候判为数组的第一位             }else if(list == this.bannerArr.length+1){                 inx = 0             }             //取数组中的值             let i = this.bannerArr[inx]             console.log(i)         }

swiperOption: { slidesPerView: 3, centeredSlides:true, loop:true, observer:true, observeParents:true, // 当Swiper的父元素变化时，会更新swiper navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev' }, on:{ transitionStart(){ // 开始translate之前触发 // 如果是第一张 if(this.activeIndex == 0){ this.setTranslate(0); // 设置位移为0 } }, click(e) { // 使用e.target事件代理获取点击的元素，通过data语法获取元素的属性值 let url = e.target.dataset.itemid; // 这里的this指向轮播,所以我在外边声明了_this用来代表vue实例 _this.goInto(url); // 跳转到详情页 } } },