element ui 表格列合并_elementui合并列

<el-table
          :show-header="false"
          :data="gridData"
          :span-method="addSpanMethod"
          border
          :cell-style="columnStyle"
          style="width: 100%; margin-top: 20px"
        >
          <el-table-column prop="name1" align="center" width="200"></el-table-column>
          <el-table-column prop="value1" align="center" width="300"></el-table-column>
          <el-table-column prop="name2" align="center" width="200"></el-table-column>
          <el-table-column prop="value2" align="center"></el-table-column>
        </el-table>

在<el-table>的标签上，添加span-method方法

  computed: {
    gridData() {
      return [
        {
          name1:"失信被执行人",
          value1: this.dataTable.iname,
          name2:"法定代表人",
          value2: this.dataTable.businessentity
        },
        {
          name1:"身份号码/组织机构代码",
          value1: this.dataTable.cardnum,
          name2: "执行法院",
          value2: this.dataTable.courtname
        },
        {
          name1:"省份",
          value1: this.dataTable.areaname,
          name2: "执行依据文号",
          value2: this.dataTable.gistid
        },
        {
          name1:"立案时间",
          value1: this.dataTable.regdate,
          name2: "案号",
          value2: this.dataTable.casecode
        },
        {
          name1:"做出执行依据单位",
          value1: this.dataTable.gistunit,
          name2: "发布日期",
          value2: this.dataTable.publishdate
        },
        {
          name1:"生效法律文书确定的义务",
          value1: this.dataTable.duty,
        },
        {
          name1:"被执行人的履行情况",
          value1: this.dataTable.performance,
        },
        {
          name1:"失信被执行人为具体情形",
          value1: this.dataTable.disrupttypename,
        }]
    }
  },

 // 和并列
    addSpanMethod({ row, column, rowIndex, columnIndex }) {
     //从第几列开始合并，columnIndex就等于几（列数的索引值以0开始）
      if (columnIndex === 1) {
        //要合并的行数索引值
        if (rowIndex === 5 || rowIndex === 6 || rowIndex === 7) {
          //此处会由 横占一个单元格竖占三个单元格 合并成一个大的单元格
          return {
            rowspan: 1,
            colspan: 3
          };
        } else {
          //不满足条件的仍是，横竖各占一个的单元格
          return {
            rowspan: 1,
            colspan: 1
          };
        }
      }
    }

以上的效果，如图所示