【element-table】实现简单的合并列

示例图：

代码：

<template>
	<el-table border stripe v-loading="loading" :data="dataList" size="small" :span-method="arraySpanMethod">
        <el-table-column label="盘点年份" align="center" prop="name"></el-table-column>
        <el-table-column label="指标数据取值月份" align="center" prop="test" width="200"> </el-table-column>
        <el-table-column label="人员" align="center" prop="name"/>
        <el-table-column label="工号" align="center" prop="name"/>
        <el-table-column label="岗位" align="center" prop="name"/>
        <el-table-column label="岗龄（月）" align="center" prop="name"/>
      </el-table>
</template>

export default {
	data() {
		return {
			dataList:[
	            {name:'qqqqqq',test:'www'},
	            {name:'qqqqqq',test:'www'},
	            {name:'qqqqqq',test:'eeee'},
	        ],
		}
	},
	methods: {
	arraySpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex == 0) {
        //合并相同的名字
        let nameSpan = this.getSpanNumber(this.dataList, "name");
        return {
          rowspan: nameSpan[rowIndex],
          colspan: 1,
        };
      }
      if (columnIndex == 1) {
        //合并相同的名字
        let nameSpan = this.getSpanNumber(this.dataList, "test");
        return {
          rowspan: nameSpan[rowIndex],
          colspan: 1,
        };
      }
    },

    getSpanNumber(data, prop) {
      let length = Array.isArray(data) ? data.length : 0;
      if (length > 0) {
        //用于标识位置
        let position = 0;
        //用于对比的数据
        let temp = data[0][prop];
        //要返回的结果
        let result = [1];
        //假设数据是AABCC，我们的目标就是返回20120
        for (let i = 1; i < length; i++) {
          if (data[i][prop] == temp) {
            //标识位置的数据加一
            result[position] += 1;
            //当前位置添0
            result[i] = 0;
          } else {
            //不相同时，修改标识位置，该位置设为1，修改对比值
            position = i;
            result[i] = 1;
            temp = data[i][prop];
          }
        }
        //返回结果
        return result;
      } else {
        return [0];
      }
    },
	}
}