监听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;
        });
相关推荐
痕忆丶3 分钟前
Typora 的替代marktext,marktext切换中文
前端
拙慕JULY8 分钟前
小程序返回 base64 文件报错
开发语言·javascript·小程序
数据知道9 分钟前
字体与排版防线:ClientRects 与系统字体枚举的底层拦截与伪造
javascript·数据采集·指纹浏览器·风控·浏览器指纹
小二·11 分钟前
Spring Boot 3 + Vue 3 全栈开发实战
vue.js·spring boot·后端
羊羊小栈15 分钟前
Uplift营销供应链协同决策系统(基于Uplift因果推断与运筹优化算法)
前端·人工智能·算法·毕业设计·大作业
阿猫的故乡17 分钟前
Vue组合式函数(Composables)从入门到实战:鼠标跟踪、请求封装、本地存储……全案例拆解
前端·vue.js·计算机外设
Upsy-Daisy22 分钟前
Hermes Agent 学习笔记 02:安装、配置与第一次运行
java·前端·数据库
一壶纱29 分钟前
一个用于 UniApp 项目的 Pinia 持久化插件
前端·javascript·vue.js
凌涘31 分钟前
JS 八大基本类型:一场内存视角的冒险之旅
前端·javascript
心之所向vjuif31 分钟前
使用 Gemini 解决前端代码报错问题
前端