问题描述：

使用小程序的modal组件实现遮罩层效果时，会出现滚动穿透的问题，即遮罩层后面的页面依旧可以滚动。

解决方案：

给底层页面动态添加 position:fixed;

代码：

wxml：

1. class="mask" wx:if="{{hasMask}}" bindtap='hideMask'>
2. 我是遮罩层
3.  
4. style="background-color:#ccc;height:2000rpx{{hasMask?'position:fixed;':''}}width:100%;>
5. 小程序弹出层点击穿透问题
6. bindtap='showMask'>弹出遮罩层
7.  

js：

1. Page({
2. data: {
3. hasMask:false
4. },
5. showMask(e) {
6. //显示遮罩
7. this.setData({
8. hasMask: true
9. })
10. },
11. hideMask(e) {
12. //隐藏遮罩
13. this.setData({
14. hasMask: false
15. })
16. }
17. }）

效果图：