微信小程序、vue遮罩层出现禁止穿透遮罩滚动页面
<div class="detail-wrapper1" @touchmove.prevent><div>
·
vue
<div class="detail-wrapper1" @touchmove.prevent>
<div>
微信小程序解决方案
解决方案
无 滑动scroll-view组件
在弹出层根元素上添加 catch:touchmove即可,
<view catchtouchmove="catchTouchHandler">...</view>
// 禁止滚动
catchTouchHandler(){
return false;
},
有 滑动scroll-view组件
在弹出层下的页面根元素添加动态样式class:
/* *.wxss */
.stop-scroll {
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%;
overflow: hidden;
}
<!-- isShowPopup变量确认是否展示弹窗的变量 -->
<view class="{{ isShowPopup ? 'stop-scroll' : '' }}">
<!-- ... -->
</view>
更多推荐
已为社区贡献71条内容
所有评论(0)