vue动态禁止页面滚动(h5)，uniapp 动态禁止页面滚动(h5)

最近在做一个短视频项目,评论的时候，点击弹框元素(非跳转的)，弹框底部会自动往上滑动，就是使用的这个方法禁止的
原理简单，就是常用的css 来控制

1. 封装方法 挂在到vue原型上

//弹出框禁止滑动
Vue.prototype.stopScroll = function () {
  var defaultNo = function (e) { e.preventDefault() }
  document.body.style.overflow = 'hidden'
  // 禁止页面滑动
  document.addEventListener('touchmove', defaultNo, false)
}
 
//弹出框可以滑动
Vue.prototype.canScroll = function () {
  var defaultNo = function (e) {
    e.preventDefault()
  }
  // 出现滚动条
  document.body.style.overflow = ''
  document.removeEventListener('touchmove', defaultNo, false)
}

2，触发事件 调用Vue 上的方法

直接在触发事件或者事件点调用
 this.stopScroll()
 this.canScroll()

有需要的小伙伴们自取哈