热门标签
热门文章
- 1MySQL多表查询语句_mysql查找员工表中的部门编号和性别
- 22024-04-30 区块链-timi.net-大陆员工办公规定-记录_timi马来西亚远程办公
- 3GitLab的原理及应用详解（一）_gitlab功能介绍
- 42024年最全2024-JAVA-大数据-面试汇总_大数据java部门面试
- 5大数据HBase（十四）：HBase的原理及其相关的工作机制_hbase自动整理机制
- 62024Android笔试题，15个经典面试问题及回答思路_安卓笔试
- 7数据结构 --手撕链表_链表工程师
- 8Mongodb中的ObjectId_mongodb 4.0 objectid
- 9交易系统TMF2.0技术揭秘：跳开 DDD 和中台概念看阿里巴巴交易平台的问题及解决思路...
- 10UGUI面板中特效显示解决方案_ugui 特效不显示
当前位置: article > 正文
vue3中实现滚动条触底加载数据_vue3 scroll-view 触底加载
作者：我家自动化 | 2024-06-10 11:42:34
赞
踩
vue3 scroll-view 触底加载
在给要滚动的元素中加上id属性，方便查找要滚动的内容。也要加上滚动事件，如图所示：
这里的 handleScroll 是滚动事件名称，在js中定义该名称相同的事件。首先用原生的方法获取你要滚动的元素。如图：
最后在滚动事件中根据进行判断，根据
-
.scrollTop 容器到顶部的距离；
-
.clientHeight 容器的高度（可视区域）；
-
.scrollHeight 容器的像素高度（完整高度，包括滚动条和隐藏的内容）；
这三个属性来判断当前滚动条是否到达底部，若已经到达底部则在判断中添加要执行的事件。
初次编辑发布权当笔记，若有不合理之处还请见谅。感谢感谢！！！
声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/我家自动化/article/detail/698620
推荐阅读
相关标签
