vue 使用 swiper loop失效

vue中使用swiper
导入

  import 'swiper/dist/css/swiper.css';
  import { swiper, swiperSlide } from 'vue-awesome-swiper';

然后页面使用

<swiper :options="banner" >
    <swiper-slide  v-for="(item,index) in bannerList" :key="index"><img :src="item.img" alt=""/></swiper-slide>
     <div class="swiper-pagination"  slot="pagination"></div>
 </swiper>

data 里面添加

banner: {
      // init:false,
         pagination: {
           el: '.swiper-pagination',
         },
         autoplay: {
         delay: 3000,
         stopOnLastSlide: false,
         disableOnInteraction: false,
         },
         loop: true,
         notNextTick: true,
         observer:true,//修改swiper自己或子元素时，自动初始化swiper
         observeParents:true,//修改swiper的父元素时，自动初始化swiper
       },

bannerList里面的内容是从后台获取的，出现了loop不起作用的问题， 在swiper上面加上 v-if=“bannerList.length>0” 就正常了

   <swiper :options="banner" class="ba_s"  v-if="bannerList.length>0">