移动端页面弹框后禁止底层页面滚动

方案一  页面增加overflow:hidden

//禁止滚动
export function stopScroll() {
  var mo = function (e) {
    e.preventDefault();
  };
  document.body.style.overflow = "hidden";
  document.addEventListener("touchmove", mo, false); //禁止页面滑动
}
/***取消滑动限制***/
export function canScroll() {
  var mo = function (e) {
    e.preventDefault();
  };
  document.body.style.overflow = ""; //出现滚动条
  document.removeEventListener("touchmove", mo, false);
}

方案二  通过position:fixed;

// 暂停滑动
    stopTouchmove(){
      document.body.style.top = `${
        document.body.getClientRects()[0].top
      }px`;
      document.body.style.position = 'fixed';
      document.body.style.left = '0';
      document.body.style.right = '0';
    },
    // 启用滑动
    startTouchmove(){
      document.body.style.position = 'static'
      window.scrollTo(
        0,
        Math.abs(+document.body.style.top.replace('px', ''))
      );
      setTimeout(() => {
        document.body.removeAttribute('style')
      }, 500)
    },