vue swiper 数据过多时卡顿的处理方法

2024-01-01  本文已影响0人  大梦无痕

当swiper-slide过多时,页面会非常卡顿,用户体验差,优化方式如下:

<swiper circular
   @change="swiperChange"
   ref="myNoCompleteSwiper"
    :options="NoCompleteSwipeOptions"
    class="NoCompletesSiper">
      <swiper-item
          v-for="(item, inx) in noCompleteUnitData" :key="inx"  class="swiperslide swiper-slide">
                   <!---你的渲染内容-->
        </swiper-item>
</swiper>

将swiper-slide 改成swiper-item,在swiper-item加上calss="swiper-slide"就能避免初始化时swiper-slide过多造成页面卡顿问题

上一篇 下一篇

猜你喜欢

热点阅读