在小程序页面里有自定义弹窗时候,发现弹窗外滚动的时候,底部背景页面也会跟随滚动。面对这个bug,我们可以用下面几种方法实现:
1、catchtouchmove="true"
可以实现弹框背景不滚动,但是也会导致弹框自身无法滚动。
如果你的弹窗本身是不需要滚动的,用这个方法是极佳的。
<view class="pop" catchtouchmove="true">
<view class="content"></view>
</view>
2、底部内容区使用scroll-view
设置scroll-view垂直滚动,并将scroll-view的高度设置为屏幕高度,这样就可以实现弹窗自身内容滚动时,而底层内容不滚动。
<scroll-view class="container" scroll-y style="height:{
{windowHeight}}px">
底部内容
</scroll-view>
<view class="pop"></view>