element table合计（可点击，自定义值，修改样式，第一行展示）

1、设置合计第一行展示

在这里插入图片描述

2、自定义合计颜色

在这里插入图片描述

3、自定义合计数量（展示后台返回值）

    methods: {
      // 总计
      getSummaries(param) {
        const { columns } = param;
        const sums = [];
        columns.forEach((column, index) => {
          // index 第几列从0开始
          if (index === 0) {
            sums[0] = '总计';
            return;
          }
          if (index === 1) {
            // this.customNum 自定义值一般为后台返回合计值
            sums[1] = this.customNum;
            return;
          }
          sums[index] = '';
        });
        return sums;
      }
    },

在这里插入图片描述

4、合计添加点击事件

    mounted() {
      let this_ = this;
      let table = document.querySelector('.el-table__footer-wrapper>table');
      this.$nextTick(()=>{
        table.rows[0].cells[1].onclick = function(){
          this_.totalClick();
        };
      })
    },
    methods: {
      // 总计点击事件
      totalClick() {
        alert('点击了')
      },
    },

在这里插入图片描述

附：所有代码