vue笔记

1全屏的弹窗，然后弹窗下面手指滑动，如何阻止页面滚动

</template>
<script>
var preD = function(e) {
  e.preventDefault();
};
export default {  
  props: ["active"],
  watch: {
    active(flag) {
      if (flag) {
        document.body.style.overflow = "hidden";
        document.addEventListener("touchmove", preD, { passive: false }); //禁止页面滑动
      } else {
        document.body.style.overflow = ""; //出现滚动条
        document.removeEventListener("touchmove", preD, { passive: false });
      }
    }
  }
 
};
</script>
<style lang="scss" scoped>

2监听页面滚动的距离

  mounted () {
    window.addEventListener('scroll', this.windowScroll)      
  },  
  methods:{
    windowScroll () {
      //滚动条距离页面顶部的距离
      let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop //原生兼容
      console.log(scrollTop) 
    },   
  }