轮播图添加点击事件

轮播图swiper 绑定点击事件 向前滑动后 点击失效处理
其中通过自定义属性去获取数据
html结构

<div class="swiper-wrapper">
   <div class="swiper-slide" v-for='(item,index) in swiperData' >
      <img :src="item.image" :data-url='item.url' :data-id='item.id' :data-isOpen='item.isOpen'/>
   </div>
</div>

js部分

  var swiper = new Swiper('.swiper-container', {
         // 如果需要分页器
          // pagination: {
          //   el: '.swiper-pagination',
          //   type: 'bullets',
          //   clickable:true,
          // },
          direction: 'horizontal',
          loop: true,
          autoplay: {
              delay: 2000,
              disableOnInteraction: false,
          },
          observer: true,
          observeParents: true,
          effect: 'coverflow',
          slidesPerView: 1.4,
          centeredSlides: true,
          on:{
            click:function(e){
              // console.log(JSON.stringify(e.target.dataset))
              vm.open_url(e.target.dataset)
            }
          }
      });