小程序自定义弹窗后禁止屏幕滚动（滚动穿透）

弹出 fixed 弹窗后，在弹窗上滑动会导致下层的页面一起跟着滚动。解决方法：在弹出层加上 catchtouchmove 事件示例代码：<view class="modal-view" hidden="{{!showModal}}" bindtap="toggleModal" catchtouchmove="pr

Ailsa-show

41486人浏览 · 2018-06-08 12:27:41

Ailsa-show · 2018-06-08 12:27:41 发布

弹出 fixed 弹窗后，在弹窗上滑动会导致下层的页面一起跟着滚动。

解决方法：

在弹出层加上 catchtouchmove 事件

示例代码：

<view class="modal-item" catchtap="makePhoneCall">{{site.phone}}</view>

</view>

Pages({

preventTouchMove() {}

})

在电脑上测试是没有用的，这是触摸事件。因此，需要在手机端测试，预览生成一个开发版，用手机微信扫描即可看到效果。

还有一种方法如下：给catchtouchmove="ture"

<view class="modal-item" catchtap="makePhoneCall">{{site.phone}}</view>

</view>

个人觉得第二种炒鸡简单适合，记得一定都在真机上看效果哦。

2048 AI社区

有“AI”的1024 = 2048，欢迎大家加入2048 AI社区

更多推荐

2026年AI搜索优化行业趋势分析：三大机遇破局红海

2048 AI社区

面向算力虚拟化的开源探索：如何看待 Flex:ai，以及为什么工程交付如此重要

开源的价值在于协作与共同演进。不同团队处于不同阶段、选择不同路径很正常；真正重要的是，行业讨论始终围绕可验证交付与工程事实推进：能力边界清晰、证据链可复现、运维闭环可依赖。密瓜智能与 HAMi 社区将持续专注于把算力虚拟化从“可切分”推进到“可治理”，并在开放协作中推动形成可互操作、可持续演进的事实标准。讨论欢迎公开进行；工程欢迎一起把复杂问题真正解决；标准也欢迎在实践与证据之上共同推进。