vue 浮层底下禁止滚动

首先遇到的问题是，弹出类似dialog的浮层。
我实现dialog的方法很简单，一个宽高是屏幕宽高的div，然后position:fixed。
如果不想让下面的布局滚动，就在div加上@touchmove.prevent

但是，但是，但是，当我们的浮层里面有可以滚动的布局的时候，这个滚到底部，就会触发下面的滚动。
一顿百度之后，有个前端大神提供了个方法，试了一下很靠谱，就是在在浮层弹出来的时候，把body定住。

 stopBodyScroll(isFixed) {
    let bodyEl = document.bodylet;
    if (isFixed) {
      this.scrollY = window.scrollY
      document.body.style = `position:fixed;top:-${this.scrollY}px;height: 100%;width:100%;overflow: hidden;`
    } else {
      document.body.style = ''
      window.scrollTo(0, this.scrollY)
    }
  },

学到了。

欢迎打赏

欢迎打赏