vue使用swiper绑定点击方法问题

最近在做swiper轮播图的时候遇到了一个问题，记录一下

问题描述：loop:true的情况下轮播图左滑，最后一张轮播图点击事件无法触发

问题分析：节点被复制，绑定时间不能被复制

错误示例：

        
           
                  // 当loop：true时，这种绑定点击事件会有问题
           
       

解决方法：

       html部分： 

             
                   // data-href用来获取item数据
                     
                 
             

      js部分：

           data(){

               return{

                   swiperOption:{

                        loop:true

                    }

               }

            }

          computed: {
              // 获取swiper实例
              swiper(){
                 return this.$refs.mySwiper.$swiper
              },
            },
           mounted:{
              let that = this
              this.swiper.on('click',function(){
              / / 这里的this是swiper的实例
              let item = JSON.parse(this.clickedSlide.attributes["data-href"].nodeValue)
              const clickedIndex = this.realIndex;
              // 这里的that是Vue的实例
               that.goDetail(clickedIndex,item);
            })
         },
         methods: {
             // 处理item数据返回给swiper实例
             func_str(item){
                 return JSON.stringify(item);
             },
            // 点击事件
            goDetail(index,item){
             // 跳转方法
            }
    }