1、合并表头

        第一种方法

                利用table的 :header-cell-style属性

<el-table:data="tableData"height="400px"max-height="400px"size="small":header-cell-style="headerStyle"fit
>

 methods: {headerStyle({ row, rowIndex }) {console.log(row, rowIndex);if (rowIndex == 0) {  // 把第1行的第2、3列变为占两行高度的表格row[1].rowSpan = 2;row[2].rowSpan = 2;}if (rowIndex == 1) { // 第2行的原本第2行的1、2、3、4列高度变成0row[1].rowSpan = 2;row[2].rowSpan = 3;row[3].rowSpan = 3;row[4].rowSpan = 3;}},//第二种办法headerStyle({ row, rowIndex }) {if (rowIndex === 1) {      //隐藏另外领两个头部单元格                       return { display: 'none' }}},},

 

        第二种方法

                利用官网提供的el-table-column互相嵌套

 

 2、普通单元格合并

        利用table的:span-method属性

<el-table:data="tableData":span-method="arraySpanMethod"style="width: 100%"
>

methods: {arraySpanMethod({ row, column, rowIndex, columnIndex }) {console.log(row,column,rowIndex,columnIndex);if (rowIndex  === 1) {  //第2行if (columnIndex === 2) {  //第3个开始return [2, 2];  //第一个参数是高,第二个参数是宽} else if (columnIndex === 1) { //第2个开始return [0, 0];}}},
}