vue监听屏幕滚动事件

先附上正常写法
  mounted () {
    window.addEventListener('scroll', this.handleScroll, true)
  },
  destroyed () {
    document.removeEventListener('scroll', this.handleScroll)
  },
  methods: {
    handleScroll () {
      let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
      console.log('scrollTop', scrollTop);
    }
  }

结果获取到的一直是0

输出

很简单的问题,当时一直没想明白。郁闷了一会在网上搜也没搜到答案,所以写个吧

解决方法

    handleScroll () {
      // let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
      let scrollTop = document.querySelector('#app').scrollTop
      console.log('scrollTop', scrollTop);
    }

你可能感兴趣的:(vue监听屏幕滚动事件)