vue中监听滑动（并解决滑动scrollTop一直为0问题）

一、代码实现

1、监听整个窗口（window）的滑动

在mounted钩子函数里添加：

mounted() {
   window.addEventListener('scroll',this.handleScroll,true)
}

然后在methods里创建绑定的方法：

 methods: {
  handleScroll(){
      let scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
      console.log(scrollTop);
    }
}

2、监听元素的滑动

同理：

mounted() {
    document.querySelector("#id").addEventListener('scroll',this.handleScroll)
 }
methods: {
  handleScroll(){
      let scrollTop = document.querySelector("#id").scrollTop;
      console.log(scrollTop);
    }
}

二、解决可能出现的document.body.scrollTop一直为0的问题

检查对应元素是否设置了overflow: scroll／auto、高度100%固定之类的样式，有的话更改样式就可以了。