element ui 表格合计项合并

如图所示:

代码:

复制代码
<el-table height="400px" :data="tableData " border
                      style="width: 100%"
                      stripe 
                      show-summary
                      ref="table"
                      id="table">
</el-table>

监听表格

复制代码
watch: {
//监听table这个对象
        tableData: {
            // 立即监听
            immediate: true,
            handler() {
                this.$nextTick(() => {
                    const tds = document.querySelectorAll(
                        "#table .el-table__footer-wrapper tr>td"
                    );
                    // colSpan合并列
                    tds[0].colSpan = 2;
                    tds[0].style.textAlign = "center";
                    tds[1].style.display = "none";
                });
            },
        },
    },

我这里是合并的两项,官方的没有合并。

相关推荐
Wang's Blog20 小时前
Lua: 基于协程的生产者-消费者模型实现
开发语言·lua
w1395485642220 小时前
Flutter跨平台开发鸿蒙化JS-Dart通信桥接组件使用指南
javascript·flutter·harmonyos
jamesge201020 小时前
限流之漏桶算法
java·开发语言·算法
Dargon28820 小时前
Simulink的SIL软件在环测试
开发语言·matlab·simulink·mbd软件开发
Hilaku20 小时前
当 Gemini 3 能写出完美 CSS 时,前端工程师剩下的核心竞争力是什么?
前端·javascript·ai编程
csbysj202020 小时前
SVG 椭圆详解
开发语言
oioihoii20 小时前
C++数据竞争与无锁编程
java·开发语言·c++
DigitalOcean20 小时前
加速 JavaScript 开发:DigitalOcean 应用托管现已原生支持 Bun
javascript
资生算法程序员_畅想家_剑魔20 小时前
Java常见技术分享-16-多线程安全-并发编程的核心问题
java·开发语言
We....20 小时前
Java SPI 机制
java·开发语言