vue内使用Swiper轮播到最后一张停止解决方法

template>
  <swiper ref="mySwiper" :options="swiperOptions" class="banner" v-if="banners.length>0">
    <swiper-slide v-for="value in banners" :key="value.bannerId" class="item">
      <a :href="value.url">
        <img :src="value.pic" alt="">
      </a>
    </swiper-slide>
    <div class="swiper-pagination" slot="pagination"></div>
  </swiper>
</template>

1.sipwer的bug,如果数据是从网络上获取的,那么自动轮播到最后一张就会停止

2.解决方法在swiper组件上加上v-if="数据.length>0"

这个方法会导致调试器报错,还有个方法就是在swiper配置内加上 centeredSlides: true,

posted @ 2022-07-23 01:54  吃惊夜夜  阅读(1223)  评论(0编辑  收藏  举报