步骤分三步:
1、获取数据
2、拿到list之后使用方法去遍历条件相同的值 (判断条件自定义)
3、合并行,可多行添加
_____
定义
spanArr: [ ]
position: 0
_____
:这里是拿到数据遍历相同的值
rowspan() { this.tableData.forEach((item, index) => { if (index === 0) { this.spanArr.push(1); this.position = 0; } else {
//这里是判断的条件 if ((this.tableData[index].name === this.tableData[index - 1].name) && (this.tableData[index].channel === this.tableData[index - 1].channel)) { this.spanArr[this.position] += 1; this.spanArr.push(0); } else { this.spanArr.push(1); this.position = index; } } }); }
:合并行,可多行添加
//这里使用element 官方方法 spanMethod({ rowIndex, columnIndex }) { //表格合并行 if (columnIndex === 1) { const _row = this.spanArr[rowIndex]; const _col = _row > 0 ? 1 : 0; return { rowspan: _row, colspan: _col }; } if (columnIndex === 2) { const _row = this.spanArr[rowIndex]; const _col = _row > 0 ? 1 : 0; return { rowspan: _row, colspan: _col }; } if (columnIndex === 3) { const _row = this.spanArr[rowIndex]; const _col = _row > 0 ? 1 : 0; return { rowspan: _row, colspan: _col }; } if (columnIndex === 14) { const _row = this.spanArr[rowIndex]; const _col = _row > 0 ? 1 : 0; return { rowspan: _row, colspan: _col }; } }