这次遇到的问题是:页面中的 Swiper 点击 .swiper-slide-next 区域时,会自动切换到下一个 slide,导致 slide 里面的链接无法正常点击。
一开始一直怀疑是:
slideToClickedSlidepreventClickspreventClicksPropagationswiper-slide-next 类名本身后来逐步排查发现,真正的问题出在 Swiper 版本和 simulateTouch 参数上。
项目原来使用的是 Swiper 8,并且默认配置了:
configs = {
simulateTouch: false,
}
这会覆盖 Swiper 官方默认行为,导致鼠标点击和触摸事件处理异常。即使配置了:
slideToClickedSlide: false
点击 slide 仍然可能触发切换。
最终将 Swiper 升级到版本 11 后,问题直接消失。Swiper 11 对点击、触摸和 slide 切换的处理更加稳定,原来的链接点击也恢复正常。
同时,通用初始化函数不再强制覆盖 simulateTouch:
configs = {}
让 Swiper 使用自身的默认配置。
最终结论:
simulateTouch: false 会放大这个问题。slideToClickedSlide: false 并不能完全解决 Swiper 8 的异常行为。
评论 (0)