H5 swiper.js slide滑动失效问题解决
Swiper滚动失效问题分析
现代浏览器为了提高滚动性能,会把 touchstart / touchmove 默认设置为 passive: true,表示不允许preventDefault()即允许页面默认滚动。而Swiper 的滑动是基于 touchstart / touchmove 做判断的,如果这些事件的默认滚动行为不能被阻止就会导致:
1、页面先滚了,Swiper 根本收不到有效的“滑动距离”
2、滑动判断中断,触发失败
3、后续 touch 状态出错
解决方案
{...touchStartPreventDefault: true, (触摸时阻止页面滚动)
passiveListeners: false,(表示允许阻止浏览器默认滚动行为)}