vue中使用vue-awesome-swiper做轮播 ，手动滑动、vue-router路由跳转和动态更新数据，导致自动轮播失效问题

前言

在做vue项目中使用vue-awesome-swiper插件做轮播图时，遇到的两个自动轮播失效问题，记录下来，也给遇到同样问题的小伙伴一个参考。

问题一：手动滑动后，自动轮播失效

swiperOption配置添加属性 autoplay:{ disableOnInteraction:false }，如下图：

问题二：vue-router路由跳转后再回到轮播图页面

之前在网上查找资料：
第一种方法是初始化配置设置observe：true,observeParents:true可以解决，尝试过后发现还是不行；
第二种使用了.stopAutoplay()和.startAutoplay()，最后成功，过程中还是尝试了很久，具体操作分享如下：
step1:获得swiper对象

  computed:{
        swiper(){
          return this.$refs.mySwiper.swiper;
        }
      },

step2:检测路由状态，在离开当前页面调用stop(),重新进入调用start()

 watch:{
        $route(newVal) {
            if (newVal.meta.index !== 0) {
              this.swiper.autoplay.stop();
            }
            else {
              this.swiper.autoplay.start();
            }
          }
        }

问题三：动态刷新数据后，轮播失效

在更新数据后调用swiper方法 slideTo()，同时可以实现刷新数据后图片回到第一张开始轮播

有什么问题，欢迎留言评论。