vue给window添加监听scroll失效问题

背景:使用element-plus插件时,有个元素设置了overflow:auto,导致滚动的并不是window,而是这个元素
未生效写法:

    const handleScroll = () => {
      let scrollTop = window.pageYOffset 
      console.log(scrollTop) //scrollTop一直为0
      state.isVisible = scrollTop > state.visibilityHeight;
    };
   onMounted(() => {
      window.addEventListener('scroll', handleScroll)
    })

正确写法

    const handleScroll = () => {
    //获取了滚动元素的值
      let scrollTop = document.documentElement.scrollTop ||
                        window.pageYOffset ||
                        document.body.scrollTop||document.querySelector('.el-main').scrollTop
      console.log(scrollTop)
      state.isVisible = scrollTop > state.visibilityHeight;
    };
 onMounted(() => {
      window.addEventListener('scroll', handleScroll,true)
    })

猜你喜欢

转载自blog.csdn.net/fankse/article/details/120326424