微信小程序中使用swiper禁止用户上下滑动且不影响外部界面的滑动

微信小程序中使用swiper禁止用户上下滑动且不影响外部界面的滑动,第1张

给swiper设置class,并且给它相对定位,给class::after绝对定位,因为swiper-item自带绝对定位

在swiper-items中添加catchtouchmove方法,但是在这个方案中,(注意::::)在手指触摸swiper这一块时野则,外部界面时型银无法进卜脊宴行滚动的!

2019/2/22

index.wxml文件斗喊

index.js文件

图片数组 imageArr 动态的改变数组的数量,

例如:当 imageArr 中的长度为4,轮差御播滚动到 3 ,current=3;此时swiper没有绑定current,并将 imageArr 的长度动态改为2,这会出现current还空庆野是3,导致swiper不显示的问题。

解决:

index.wxml 中在swiper中绑定current

index.js 中增加current

学小程序时写过一个B站demo,坦芦也遇到此漏陵问题,最后自定义Swiper的Dot来实现让搜带了。 思路是:用view组件重写dot,给swiper组件绑定bindchange事件用来获取当前第几个dot,动态改变class。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/12541911.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-26
下一篇 2023-05-26

发表评论

登录后才能评论

评论列表(0条)

保存