微信小程序 scroll-view滚动问题

问题描述

问 题

用微信小程序做一个订单页的功能~效果是当用户点击按钮的时候弹出一个遮罩层~同时遮罩层上显示一个订单列表~超过容器部分则垂直滑动~现在遇到个问题是因为还木有appid~只能在开发者工具上测试~发现使用scroll-view时候内容只能通过鼠标滚轮来滑动~按理说鼠标点击后滑动应该就相当于移动端的touchmove~应该也能滑动才对~查看博客发觉好多人的动图演示也确实是鼠标左键按下后滑动~scroll-view内的内容就会动了~不知道是什么原因~还是说这只是开发者工具的问题~到时用真机的时候就不存在这个问题了

解决方案

微信小程序的坑太多了。
这个问题我的解决方案是：
底层page上的内容也用一个scroll-view来放置，page的css属性设置成width100%height100%，css隐藏滚动条。
一个半透明全覆盖mask层用来遮住page的内容，同时用来屏蔽点击。
mask中放置scroll-view。

这样能完全阻断遮罩层和底部page关联的方法。无论是滚轮还是touchmove，都只在当前层有效。

这篇关于微信小程序 scroll-view滚动问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！