微信小程序弹出类禁止滚动(遮罩层的运用)

遮罩层都知道就是一个通过触发事件让其显示的弹出层
			<view class="mask" v-if="checknum !==0" catchtouchmove='ture' @touchmove.stop.prevent></view>
  • v-if 中写入判断条件
  • catchtouchmove=‘ture’ 这个属性打开就会静止绑定弹出层的滑动
  • 使用场景: 第一次做的项目中上传版本的时候出现了,微信开发者工具上可以做到效果, 然而真机不行, 百度得知的这个属性。加上去, 噢力给!!!!
  • 记录一下: mask遮罩层 不要单独的放在scroll-view标签的外边儿!!!! 可以放在里面或者在外边也套上一个scroll-view标签并属性, 但是还是推荐scroll-view (我的个人想法)

给最外面的和盒子设置 relative

.mask {
		position: fixed;
		bottom: 0;
		width: 750rpx;
		height: 100vh;
		background: rgba($color: #000000, $alpha: .3);
	}

mask的样式这样就行了, 让其固定,宽度750rpx, 高度满视口,定位在页面的底部!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值