1、
swiper-slide相关的点击事件需要在swiperOptions配置项中调用，因为在loop模式下，直接写在swiper-slide上的click方法会在第二次循环开始时出现首张点击无反应的情况，这是由于loop模式下只复制了dom节点但没有复制dom事件
2、
swiperOptions配置项中的事件方法内的this，指向的是 swpier 实例，而不是当前的 vue，所以需要在外部定义缓存变量用来调用组件内的数据以及方法
3、
在外部定义缓存变量的时候，要在data内进行定义
data() {
let vm = this; // 在此处定义
return {
swiperOptions: {
loop: true, // 是否无缝循环
on: {
click: function() {
vm.handleClick(this.realIndex); // 此处this与vm指向不同
}
}
}
};
如果使用以下该定义方法，在某些情况下会出现数据混乱的问题
定义.png
赋值.png
当页面需要多个swiper时，为了方便会根据业务需求封装swiper组件，并在同一页面多次调用，如果使用上图的定义方法，不论在哪个组件中调用swiper事件，此时vm只会拿到最后调用的那个组件内部的数据
1.png
2.png
4、
swiper事件使用箭头函数this并没有指向vue，依然是指向的swiper实例
箭头函数内的this依然指向swiper实例.png
