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

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

相关推荐
FreeBuf_12 分钟前
利用零宽度字符的隐形JavaScript混淆工具InvisibleJS浮出水面
开发语言·javascript·ecmascript
lsx20240630 分钟前
Go 语言指针
开发语言
yyt36304584137 分钟前
TypeScript { [key: string]: unknown } 索引签名写法和 Record 替代
前端·javascript·vue.js·typescript·ecmascript·es6
wearegogog1231 小时前
基于MATLAB的IEEE 9节点系统潮流计算
开发语言·matlab
分布式存储与RustFS1 小时前
RustFS在AI场景下的实测:从GPU到存储的完整加速方案
开发语言·人工智能·rust·对象存储·企业存储·rustfs·minio国产化替代
揽昕1 小时前
判断对象是否含有某个属性
开发语言·前端·javascript
phltxy2 小时前
解锁JavaScript WebAPI:从基础到实战,打造交互式网页
开发语言·javascript
资生算法程序员_畅想家_剑魔2 小时前
Java常见技术分享-分布式篇-分布式系统基础理论
java·开发语言·分布式
FL16238631292 小时前
C# winform部署yolo26-obb旋转框检测的onnx模型演示源码+模型+说明
开发语言·c#
大猫和小黄2 小时前
Java异常处理:从基础到SpringBoot实战解析
java·开发语言·spring boot·异常