element plus el-table合并单元格

合并第一列 第二列 内容一样的列

 <el-table :data="tableData" :span-method="objectSpanMethod"
                style="width: 100%;height: 100%;overflow-y: auto;" border  >
                <!-- 静态列 -->
                <el-table-column prop="index" label="序号" width="100" align="center"/>
                <el-table-column prop="name" label="区域" align="center"/>
                <el-table-column prop="inNum" label="当前入园（人）" align="center"/>
                <el-table-column prop="outNum" label="当前离园（人）" align="center"/>
                <el-table-column prop="times" label="当前时间(时)" align="center"/>
            </el-table>

const objectSpanMethod = (
    {
        row,
        column,
        rowIndex,
        columnIndex,
    }: any
) => {
    // 合并序号列
    if (column.property === 'index') {
        if (rowIndex > 0 && tableData.value[rowIndex].index === tableData.value[rowIndex - 1].index) {
            return { rowspan: 0, colspan: 0 };
        }
        return { rowspan: getRowspan('index', rowIndex), colspan: 1 };
    }

    if (column.property === 'name') {
        if (rowIndex > 0 && tableData.value[rowIndex].name === tableData.value[rowIndex - 1].name) {
            return { rowspan: 0, colspan: 0 };
        }
        return { rowspan: getRowspan('name', rowIndex), colspan: 1 };
    }

    return { rowspan: 1, colspan: 1 };

}

const getRowspan = (prop, rowIndex) => {
    let rowspan = 1;
    const currentValue = tableData.value[rowIndex][prop];
    for (let i = rowIndex + 1; i < tableData.value.length; i++) {
        if (tableData.value[i][prop] === currentValue) {
            rowspan++;
        } else {
            break;
        }
    }
    return rowspan;
};