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

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

相关推荐
前端Hardy8 小时前
面试官:JS数组的常用方法有哪些?这篇总结让你面试稳了!
javascript·面试
yuki_uix8 小时前
Props、Context、EventBus、状态管理:组件通信方案选择指南
前端·javascript·react.js
全栈老石8 小时前
手写无限画布4 —— 从视觉图元到元数据对象
前端·javascript·canvas
Leon10 小时前
新手引导 intro.js 的使用
前端·javascript·vue.js
牛奶10 小时前
JS随笔:浏览器 API(DOM 与 BOM)
前端·javascript·面试
牛奶11 小时前
JS随笔:异步编程与事件循环
前端·javascript·面试
牛奶11 小时前
JS随笔:数据结构与集合
前端·javascript·面试
小陆猿11 小时前
股票实时行情Echarts动态图表
前端·javascript
牛奶11 小时前
JS随笔:ES6+特性与模块化实践
前端·javascript
牛奶11 小时前
JS随笔:基础语法与控制结构
前端·javascript