el-table 实现下拉到底部加载数据
可用于所有下拉的情况,通过监听滚动条事件来记录,若当前滚动条等于0的情况为底部就进行数据获取
const timer = setInterval(() => { const dom = document.querySelector('.button-style'); if (dom) { clearInterval(timer) console.log(dom); dom.addEventListener('scroll', (v) => { const scrollDistance = dom.scrollHeight - dom.scrollTop - dom.clientHeight; console.log(scrollDistance); // 判断是否到底,可以加载下一页 if (scrollDistance <= 1) { // 判断是否全部加载完成 if (this.page >= this.totalPage) { this.$message.warning('达到上限'); } if (this.page < this.totalPage) { // 当前页数小于总页数就请求 this.page++; // 当前页数自增 // 加载下一页方法 // this.getNextList(); this.loading = true console.log('加载数据中...'); setTimeout(() => { this.loading = false }, 1000); } } }); } });
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通
2021-08-04 微信小程序自定义组件学习(一)