【bug】记录一次使用Swiper插件时loop属性和slidersPerView属性冲突问题

简言

最近在vue3使用swiper时,突然发现loop属性和slides-per-view属性同时存在启用时,loop生效,下一步只能生效一次的bug,上一步却是好的。非常滴奇怪。

解决过程

  1. 分析属性是否使用错误。
    loop是循环模式,布尔型。
    slides-per-view是同屏显示多少数量,数值型或’auto’。
  2. 更改的样式是否是诱因。
    不是。
  3. 看官网,百度。
    百度不到相似bug,看官网。发现loop属性描述有限制性描述。
    在这里插入图片描述
  4. 最后寻找替代方案,或者降低需求。
    没到这步。

问题原因

官网loop属性时描述有这样一句话。

Because of nature of how the loop mode works (it will rearrange
slides), total number of slides must be >= slidesPerView * 2

意思就是 你的数据要大于等于 一屏显示数量的两倍
在这里插入图片描述

解决方案

  • 数据搞多点。
  • slides-per-view属性值调小。

猜你喜欢

转载自blog.csdn.net/qq_43231248/article/details/132106493