Skip to content

遮罩层阻止默认滚动事件

在写移动端页面的时候,弹出遮罩层后,我们仍然可以滚动页面。vue中提供@touchmove.prevent.stop,@mousewheel.prevent方法可以完美解决这个问题。

html
<div class="dialog" @touchmove.prevent.stop @mousewheel.prevent></div>

如果不使用vue的话,可以给body添加overflow:hidden属性解决。

/src/vue/%E9%81%AE%E7%BD%A9%E5%B1%82%E9%98%BB%E6%AD%A2%E9%BB%98%E8%AE%A4%E6%BB%9A%E5%8A%A8%E4%BA%8B%E4%BB%B6.html