监听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;
        });
相关推荐
无限压榨切图仔14 分钟前
从 Claude Code 切到 Codex:我用 Agent、Skills、MCP 做完了一个内容运营工具
前端·后端
濮水大叔18 分钟前
NestJS 与 CabloyJS 的 env/config 架构对比:从环境变量到实例级配置
前端·node.js·nestjs
成都渲染101云渲染666618 分钟前
Blender渲染时,纯CPU渲染的设置教程
前端·javascript·blender
董员外21 分钟前
RAG 系统进化论(一):纵览 RAG 的发展历程
前端·人工智能·后端
多加点辣也没关系40 分钟前
JavaScript|第30章:事件机制
开发语言·javascript
Gauss松鼠会1 小时前
【GaussDB】GaussDB锁阻塞源头查询
java·开发语言·前端·数据库·算法·gaussdb·经验总结
YHHLAI1 小时前
Vue 3 流式输出实战:从零掌握 LLM Streaming 与 SSE 协议
前端·javascript·vue.js
2601_965798472 小时前
Arrow Unlocker HTML5 Game Review: Keep Web Arcade Players Coming Back
前端·html·html5
不简说2 小时前
JS 代码技巧 vol.10 — 20 个 V8 引擎原理,解释"为什么这样写快"
前端·javascript·面试
醉城夜风~2 小时前
HTML常用标签详解学习博客:从基础标签到页面结构完整掌握
前端·学习·html