美文网首页
vue监听屏幕滚动事件

vue监听屏幕滚动事件

作者: 刘其瑞 | 来源:发表于2022-08-05 15:15 被阅读0次
    先附上正常写法
      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监听屏幕滚动事件

          本文链接:https://www.haomeiwen.com/subject/fgqhlrtx.html