Vue开发swiper速记

swiperjs.com/

• 获取swiper实例： 在swiper上@swiper初始化事件,每一个swiper都有自己的实例

<swiper @swiper="setSwiper">
     <swiper-slide> </swiper-slide
</swiper>

• thumbs是缩略图的意思
• 实现缩略图和预览图联动的方式：

// 预览图swiper中：
 <swiper :thumbs="{ swiper: thumbsSwiper }"></swiper>
 // 缩略图swiper中:
  <swiper @swiper="(swiper)=>{thumbsSwiper=swiper}"></swiper>

• 移动切换swiper-slide：swiper.slideTo()
• 更新dom时更新swiper：swiper.update();
• slideTo()可以改变swiper的activeIndex并触发active的样式和动画
• 当缩略图发生一些错误不妨试试用修改预览图的方法来修复并控制缩略图

后续再更新补充