vue中监听页面滚动和监听元素滚动

监听页面滚动

在生命周期mounted中进行监听滚动：

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

在方法中定义监听滚动执行的方法：

scrollToTop() {
  var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
  console.log(scrollTop)
},

监听某元素滚动

tips：需要监听的这个元素需要拥有固定的高度

<div id="app" ref="app" @scroll="handleScroll"></div>

handleScroll() {
  const scrollTop = this.$refs.app.scrollTop
  console.log(scrollTop)
},