<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');
}
},
elment Table多级表头固定列后,合计行错位显示问题解决
晴空万里藏片云2025-02-24 1:37
相关推荐
爱摄影的程序猿10 分钟前
Python Web 框架 django-vue3-admin快速入门 django后台管理大叔_爱编程20 分钟前
wx203基于ssm+vue+uniapp的教学辅助小程序洁洁!24 分钟前
数据采集助力AI大模型训练MaCa .BaKa29 分钟前
25-智慧旅游系统(协同算法)三端MiyueFE33 分钟前
bpmn-js 源码篇9:Moddle - 对象格式的标准化定义库excel39 分钟前
webpack 核心编译器 七 节Debug 熊猫1 小时前
【Java基础】10章、单例模式、final关键字的使用技巧和使用细节、单例模式-懒汉式、单例模式-饿汉式【3】一只月月鸟呀1 小时前
HTML中数字和字母不换行显示天下代码客1 小时前
【八股】介绍Promise(ES6引入)lb29171 小时前
CSS 3D变换,transform:translateZ()