vue使用swiper(vue-awesome-swiper)使用以及环状轮播(loop:true)不起作用的问题

先上图

[code]安装
npm install vue-awesome-swiper --save

[code]全局引入(main.js)
import VueAwesomeSwiper from 'vue-awesome-swiper'
Vue.use(VueAwesomeSwiper)
import 'swiper/dist/css/swiper.css'

(部分数据来自接口)

[code]	<swiper :options="swiperOption" ref="mySwiper" v-if="swiperList.length>1">
<!--用v-if控制loop环状轮播，否则不起作用-->
<swiper-slide v-for="(item,index) in swiperList"
:index="index" :key="item.index" class="swiper_box">
<div class="goodsimg">
<img :src=imgURL+item.goodsPicture alt="" />
</div>
<p class="rank">TOP{{index+1}}</p>
<p class="code">{{item.goodsCode}}</span>
</p>
<p class="viewnum">浏览量：{{item.browseAmount}}</p>
</swiper-slide>
</swiper>

data 里面的配置

[code]    data() {
return {
swiperOption: {
//设定初始化时slide的索引
initialSlide: 0,
//Slides的滑动方向，可设置水平(horizontal)或垂直(vertical)
direction: 'horizontal',
autoplay: {
delay: 2500, //1秒切换一次
disableOnInteraction: false,
},
//环状轮播
loop: true,
slidesPerView: 'auto',
loopedSlides: 3,
loopAdditionalSlides: 0,
//一个屏幕展示的数量
slidesPerView: 3,
//间距
spaceBetween: 26,
//修改swiper自己或子元素时，自动初始化swiper
observer: true,
//修改swiper的父元素时，自动初始化swiper
observeParents: true
},
swiperList: []
}
},

运行swiper

[code]computed: {
swiper() {
return this.$refs.mySwiper.swiper
}
},