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

 1 var preD = function (e) {
 2     e.preventDefault()
 3 }
 4 export default {
 5     data () {
 6         return {
 7         popupStatus: false
 8     }
 9     },
10     watch: { // 监听data中弹层状态
11         popupStatus (val) {
12             if (val) {
13             document.body.style.overflow = 'hidden'
14             document.addEventListener('touchmove', preD, {passive: false}) // 禁止页面滑动
15         } else {
16             document.body.style.overflow = '' // 出现滚动条
17             document.removeEventListener('touchmove', preD, {passive: false})
18         }
19         }
20     }
21 }