监听el-table滚动

javascript 复制代码
mounted() {
    // 监听el-table滚动
    window.addEventListener("scroll", this.loadMore, true);
  },

后端接口没有分页,一次性返回全部数据,前端监听滚动条加载数据。

this.tableList当前表格展示的数据

this.allTableData接口获取的全部数据

javascript 复制代码
 loadMore() {
      let curlens = this.allTableData.length;
      let showlens = this.tableList.length; 
      if (showlens >= curlens) {
        return;
      } else {
          this.tableList.push(
            ...this.allTableData.slice(showlens, showlens + 10)
          );
      }
    },
//接口获取表格数据

 abStsLog(this.filters).then((res) => {
          this.tableList = res.data.slice(0,20);
          this.allTableData = res.data;
          this.listLoading = false;
        });
相关推荐
YAwu11几秒前
深入解析 React 炫彩鼠标跟随标题组件:从坐标定位到动画性能
前端·react.js
GuWenyue6 分钟前
排序效率低?5分钟吃透快速排序,性能飙升至O(nlogn)
前端·javascript·面试
OpenTiny社区9 分钟前
🎨 看完 GenUI SDK 源码我悟了!
前端·vue.js·github
叁两12 分钟前
前端转型AI Agent该如何学习?(前置篇)
前端·人工智能·node.js
何时梦醒16 分钟前
深入理解递归与快速排序 —— 从基础入门到手写实现
前端·javascript
爱勇宝18 分钟前
淡泊名利之前,先承认我们都很焦虑
前端·后端·程序员
bonechips27 分钟前
LLM 的无状态:从 HTTP 协议到对话上下文工程
前端·javascript
杨利杰YJlio28 分钟前
Codex桌面客户端上手:项目、插件与自动化实战
前端·后端
胡志辉28 分钟前
从 prototype 到 V8,看懂 JavaScript 原型链
前端·javascript
ricardo197328 分钟前
React 渲染优化:memo / useMemo / useCallback 的正确姿势与并发模式实战
前端·面试