vue页面有弹层，禁止页面滚动

vue页面有弹层，禁止页面滚动

data() {
  return {
    popupVisible: false
},
watch: { // 监听data中弹层状态
  popupVisible(val) {
    if (val) {
      document.body.style.overflow = 'hidden'
      document.addEventListener('touchmove', function (e) {
        e.preventDefault()
      }, {
        passive: false
      }) // 禁止页面滑动
    } else {
      document.body.style.overflow = '' // 出现滚动条
      document.removeEventListener('touchmove', function (e) {
        e.preventDefault()
      }, {
        passive: false
      })
    }
  }
},