表格动态合并行方法

方法

export function getRowSpans(arr, key1, key2) {
    let sameValueLength = 0;
    const rowSpans = [];
    for (let i = arr.length - 1; i >= 0; i--) {
        if (i === 0) {
            rowSpans[i] = sameValueLength + 1;
            continue;
        }
        if (arr[i][key1] === arr[i - 1][key1] && arr[i][key2] === arr[i - 1][key2]) {
            rowSpans[i] = 0;
            sameValueLength++;
        } else {
            rowSpans[i] = sameValueLength + 1;
            sameValueLength = 0;
        }
    }
    return rowSpans;
}

使用

根据工号+姓名的唯一性来判断是否需要合并

this.rowSpans = getRowSpans(this.tableData, 'empno', 'empname')

通过给table组件传入:span-method="objectSpanMethod"方法可以实现合并行或列，方法的参数是一个对象，里面包含当前行row、当前列column、当前行号rowIndex、当前列号columnIndex四个属性。该函数可以返回一个包含两个元素的数组，第一个元素代表rowspan，第二个元素代表colspan。 也可以返回一个键名为rowspan和colspan的对象。

// 合并单元格，此处只合并第一到第十二列的属性值 
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
    if (columnIndex != 0 && columnIndex < 12) {
        const _row = this.rowSpans[rowIndex]
        const _col = _row > 0 ? 1 : 0
        return {
            rowspan: _row,
            colspan: _col
        }
    }
}