elment Table多级表头固定列后,合计行错位显示问题解决

复制代码
<el-table-column :label="tabsDataFilters1.orgName" width="370" :fixed="tableFixed">
  <el-table-column type="index" label="序号" width="50" align="center" :fixed="tableFixed"></el-table-column>
  <el-table-column prop="name" label="姓名" width="200" align="left" :fixed="tableFixed"></el-table-column>
  <el-table-column prop="age" :formatter="formatAmount" label="小计" width="120" align="center" :fixed="tableFixed"></el-table-column>
</el-table-column>

mounted进行监听,监听方法如下:

observeClassChanges() {
  debugger
  this.$nextTick(() => {
    const bodyWrapper = this.$refs.table1.$el.querySelector('.el-table__body-wrapper');
    if (!bodyWrapper) return;

    // 创建 MutationObserver 监听 class 变化
    this.observer = new MutationObserver((mutationsList) => {
      for (const mutation of mutationsList) {
        if (mutation.attributeName === 'class') {
          this.removeScrollingClasses(bodyWrapper);
        }
      }
    });

    // 监听 `class` 变化
    this.observer.observe(bodyWrapper, {
      attributes: true,
      attributeFilter: ['class'],
    });

    // 初始移除 class,防止渲染时已有
    this.removeScrollingClasses(bodyWrapper);
  });
},
// 滚动中间行样式移除
removeScrollingClasses(bodyWrapper) {
  if (bodyWrapper.classList.contains('is-scrolling-middle')) {
    bodyWrapper.classList.remove('is-scrolling-middle');
  }
  if (bodyWrapper.classList.contains('is-scrolling-left')) {
    bodyWrapper.classList.remove('is-scrolling-left');
  }
},
相关推荐
+VX:Fegn08951 小时前
计算机毕业设计|基于springboot + vue蛋糕店管理系统(源码+数据库+文档)
前端·数据库·vue.js·spring boot·课程设计
半个落月2 小时前
LangChain.js Agent Memory 实战(下):用 Milvus 构建可检索的长期记忆
javascript·langchain
半个落月2 小时前
LangChain.js Agent Memory 实战(上):从内存对话、文件持久化到截断与摘要
javascript·langchain
Nicander3 小时前
我给 Excalidraw 做了一个本地工作区:DrawSpace
前端·开源
linux_cfan4 小时前
17 · 引擎适配器全景:HLS/DASH/Vimeo/Mux/Cast
前端·javascript·音视频
计算机魔术师5 小时前
烧掉2780亿美元还不够?OpenAI的资本豪赌让人头皮发麻
前端
IT_陈寒5 小时前
Java线程池用错参数,我的服务居然悄悄崩溃了
前端·人工智能·后端
卡布鲁6 小时前
React useMemo 与 useCallback 完全指南:原理、场景与避坑
前端·react.js
碳基修炼6 小时前
排查记:本地 devServer 是 http,浏览器却把 302 重定向升级成了 https
前端·http
步行cgn6 小时前
Spring p 命名空间注入详解
java·前端·spring