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";
                });
            },
        },
    },

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

相关推荐
NULL->NEXT11 分钟前
Java(day7)
java·开发语言
草木红12 分钟前
三、Angular 路由
前端·javascript·angular.js
李老头探索20 分钟前
Java 异常机制详解:类型、原理、关键字与最佳实践
java·开发语言
DevOpsDojo22 分钟前
Perl语言的循环实现
开发语言·后端·golang
鬼鬼骑士22 分钟前
Java实用办公小程序
java·开发语言·小程序
专注API从业者26 分钟前
如何处理获取到的淘宝评论数据以进行有效的商品品控?
大数据·开发语言·数据库·算法
顾漂亮27 分钟前
玩转多线程--入门
开发语言·java-ee
柠石榴29 分钟前
【练习】力扣 热题100 两数之和
开发语言·c++·算法·leetcode
go_bai32 分钟前
数据结构——栈的实现
c语言·开发语言·数据结构·经验分享·笔记·学习方法
LoserChaser37 分钟前
QT中引入OpenCV库总结(qmake方式和cmake方式)
开发语言·qt·opencv