vue动态实时获取页面高度

最新推荐文章于 2025-06-03 17:18:11 发布

小宇同学哇

最新推荐文章于 2025-06-03 17:18:11 发布

阅读量3.1k

点赞数 2

CC 4.0 BY-SA版权

分类专栏： vue.js 滚动条高度文章标签：前端 javascript

原文链接：https://www.jianshu.com/p/2abd7b76eee5

vue.js 同时被 2 个专栏收录

4 篇文章

订阅专栏

滚动条高度

1 篇文章

订阅专栏

该篇博客详细介绍了如何在Vue应用中监听页面滚动事件，并通过`scrollHandle`方法动态获取页面滚动的高度。作者使用了`window.addEventListener('scroll')`来绑定滚动事件，并在事件处理函数中通过`e.srcElement.scrollingElement.scrollTop`获取滚动高度，从而实现对页面滚动状态的监控。这对于需要根据滚动位置执行特定操作的前端开发非常有用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

动态获取实时页面高度

mounted(){
     window.addEventListener('scroll',this.scrollHandle);//绑定页面滚动事件
 },
//获取页面滚动高度
methods:{
      scrollHandle(e){
      let top = e.srcElement.scrollingElement.scrollTop;    // 获取页面滚动高度
      console.log(top);
  }
}