主要介绍了在vue中实现禁止屏幕滚动,禁止屏幕滑动，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧

在写移动端页面的时候,弹出遮罩层后，我们仍然可以滚动页面。 vue中提供 touchmove.prevent 方法可以完美解决这个问题 如果不是使用Vue的话，可以给body添加overflow:hidden属性解决 补充知识：vue项目中禁止页面滚动 / 滚动事件穿透 (弹出蒙版时，弹出层下面还可以滚动) vue项目中弹出层时，蒙版下还可以滚动页面。 移动端解决方案 在蒙层所在div上加 touchmove.prevent <div class=”maskBox” touchmo

今天写了一个Vue弹层组件，用来全屏查看图片的，大概是下面这么一个效果： 其中背景是透明色的，但是弹出这个组件时手指滑动、鼠标滚轮滑动，底部页面是会动。 作为自己开发的一个常用的组件，这种bug当然是要解决的。 于是学艺不精的我在网上找了蛮久的，看了不少博客，看了不少观点和方法。终于找到了一个最简单、最实在的方法， 代码如下： ... 首先，这个div就是整个遮罩组件的根组件，核心就是d

vue中移动端禁止页面滑动穿透 1 通过样式 // 禁止滚动 stop () { var mo = function (e) { e.preventDefault() } let cssStr = 'overflow-y: hidden; height: 100%;' document.getElementsByTagName('body')[0].style.cssText = cssStr docum