前端社区
vue面试题：vue如何禁止弹窗后面的滚动条滚动？
墨衍会员 · AI 创作全网分发 墨衍智能分发 通过墨衍一键同步至各平台 可同步平台 CSDN微信公众号微博知乎掘金百家号博客园抖音小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年，写一次发全网
我也要 关注 + 加入社区vue如何禁止弹窗后面的滚动条滚动？
methods : {
//禁止滚动
stop(){
var mo=function(e){e.preventDefault();};
document.body.style.overflow='hidden';
document.addEventListener("touchmove",mo,false);//禁止页面滑动
},
/***取消滑动限制***/
move(){
var mo=function(e){e.preventDefault();};
document.body.style.overflow='';//出现滚动条
document.removeEventListener("touchmove",mo,false);
}
}
相关推荐
vue.js-div滚动条隐藏但有滚动效果的实现方法
组件被包在一个高度固定的div mounted () { var boDiv = document.getElementById(this.id); if(boDiv == undefined){ return; } var isFirefox=navigator.userAgent.indexOf("Firefox") if(isFirefox>0){ boDiv.addEventListener('DOMMouseScroll', function(event) { //火狐 var evt = window.event || arguments[0]
在vue中实现禁止屏幕滚动,禁止屏幕滑动
主要介绍了在vue中实现禁止屏幕滚动,禁止屏幕滑动，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
手机弹窗 禁止body滚动
h5手机页面弹窗，弹窗内滑动，禁止body滚动。h5手机页面弹窗，弹窗内滑动，禁止body滚动
vue中移动端禁止页面滚动
vue中移动端禁止页面滑动穿透 1 通过样式 // 禁止滚动 stop () { var mo = function (e) { e.preventDefault() } let cssStr = 'overflow-y: hidden; height: 100%;' document.getElementsByTagName('body')[0].style.cssText = cssStr document.documentElement.style.height = '100%' do
vue 遮罩层阻止默认滚动事件操作
在写移动端页面的时候,弹出遮罩层后，我们仍然可以滚动页面。 vue中提供 @touchmove.prevent 方法可以完美解决这个问题 <div class=”dialog”></div> 如果不是使用Vue的话，可以给body添加overflow:hidden属性解决 补充知识：vue项目中禁止页面滚动 / 滚动事件穿透 (弹出蒙版时，弹出层下面还可以滚动) vue项目中弹出层时，蒙版下还可以滚动页面。 移动端解决方案 在蒙层所在div上加 @touchmove.prevent <div class=”maskBox” @touchmove.p
