第一次发,请各位大佬多多指教
方法
export default {
data() {
return {
rowspans: []
}
},
methods: {
computeRowspan(columns, data) {
this.rowspans = [];
columns.forEach((item, index) => {
if (item.rowMerge) {
let curColRowspan = [];
let rowSpan = 0;
let fast = 0;
let slow = 0;
while (fast < data.length) {
if (data[fast][item.key] === data[slow][item.key]) {
curColRowspan[fast] = 0;
if (fast === data.length - 1) {
curColRowspan[slow] = fast - slow + 1;
}
rowSpan++;
fast++;
} else {
curColRowspan[slow] = rowSpan;
rowSpan = 0;
slow = fast;
}
}
this.rowspans[index] = curColRowspan;
}
})
},
getRowspan(columnIndex, rowIndex) {
if (this.rowspans.length === 0) {
return [1, 1];
}
const value = this.rowspans[columnIndex];
if (value) {
return [value[rowIndex], value[rowIndex] === 0 ? 0 : 1];
} else {
return [1, 1];
}
},
}
}
使用
// 1、mixins混入
mixins[name];
// 2、columns添加属性
columns:[
{
key: 'aa',
rowMerge: true,
},
{
key: 'bb',
rowMerge: true,
}
],
data: [],
// 3 、监听需要合并的数据
watch: {
data: {
handler(val,oldVal){
if(val) {
this.computeRowspan(this.columns,val);
}
},
deep:true,
},
}
// 4、返回rowspan和colspan
handleSpan({ row, column, rowIndex, columnIndex }) {
return this.getRowspan(columnIndex,rowIndoex);
}