【vue2】swiper插件自动循环失效（loop失效）

可能是因为数据是动态渲染的，在请求到数据之前，就已经完成了swiper的初始化，因此解决方案有：

1.swiper组件添加v-if：（如以下代码中的v-if="banner.length"）

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45

<!-- 轮播图 -->       <div :class="$style.newsBanner">         <div :class="$style.swiperBox">           <swiper             ref="newsSwiper"             :options="swiperOptions"             :class="$style.swiper"             v-if="banner.length"           >             <swiper-slide v-for="(el, index) in banner" :key="index">               <img :src="el.src" style="height: 100%; width: 100%" />             </swiper-slide>             <div               class="swiper-pagination"               :class="$style.swiperPaginationNews"               slot="pagination"             ></div>           </swiper>         </div>       </div>     data() {     return {       swiperOptions: {         loop: true,         speed: 500,         autoplay: {           delay: 4000,           stopOnLastSlide: false,           disableOnInteraction: false,         },         pagination: {           el: ".swiper-pagination",           type: "bullets",           clickable: true,         },         observer: true, //修改swiper自己或子元素时，自动初始化swiper         observeParents: true, //修改swiper的父元素时，自动初始化swiper       },       banner: [],       list: [],       data: [],       active: 0,     };   },

　　

2.参考以下博客，获取到数据时初始化：

https://www.nhooo.com/note/qagvr7.html