element合并单元格
程序员文章站
2022-07-13 14:28:05
...
获取表格基础合并数组
getIndex(){
let table = this.tableData
this.spanArray = []
table.forEach((item,index)=>{
if(index === 0){
this.spanArray.push({sameName:item.matterOrg,flag:0,arr:[]})
this.spanArray.push({sameName:item.matterId,flag:0,arr:[]})
this.spanArray.push({sameName:item.materialId,flag:0,arr:[]})
this.spanArray.push({sameName:item.itemId,flag:0,arr:[]})
this.spanArray.push({sameName:item.confirmId,flag:0,arr:[]})
this.spanArray.push({sameName:item.cmaterialId,flag:0,arr:[]})
this.spanArray.push({sameName:item.citemId,flag:0,arr:[]})
}else{
this.getSpan(item.matterOrg,index,0,table.length)
this.getSpan(item.matterId,index,1,table.length)
this.getSpan(item.materialId,index,2,table.length)
this.getSpan(item.itemId,index,3,table.length)
this.getSpan(item.confirmId,index,4,table.length)
this.getSpan(item.cmaterialId,index,5,table.length)
this.getSpan(item.citemId,index,6,table.length)
}
})
}
非合并情况下进行数组替换
getSpan(value,index,arrayIndex,tableLength){
if(value !== this.spanArray[arrayIndex].sameName || !value){
this.spanArray[arrayIndex].arr.push({ row:this.spanArray[arrayIndex].flag,
length:index - this.spanArray[arrayIndex].flag})
this.spanArray[arrayIndex].sameName = value
this.spanArray[arrayIndex].flag = index
if(index === tableLength-1){
this.spanArray[arrayIndex].arr.push({ row:this.spanArray[arrayIndex].flag,
length: 1})
}
}else{
if(index === tableLength-1){
this.spanArray[arrayIndex].arr.push({ row:this.spanArray[arrayIndex].flag,
length: index+1 - this.spanArray[arrayIndex].flag})
}
}
}
合并单元格,table绑定
<el-table :data="tableData" v-loading="loading" border style="width: 100%;" :span-method="arraySpanMethod">
arraySpanMethod: function({ row, column, rowIndex, columnIndex }){
let col = [
[1],[2,3],[4,5],[6],[7,8,9],[10,11],[12,13]
]
let flag = 1
let obj = [0, 0]
if(columnIndex === 0){
obj = [1, 1]
}else{
col.forEach((colArray,arrayIndex)=>{
if(flag === 1){
colArray.forEach((colIndex)=>{
if (columnIndex === colIndex && flag === 1) {
if(this.spanArray[arrayIndex].arr.length >0 ){
this.spanArray[arrayIndex].arr.forEach(item => {
if (rowIndex === item.row) {
obj = [item.length, 1]
flag = 0
}
})
}else{
obj = [1, 1]
}
}
})
}
})
}
return obj
}
上一篇: easyui 合并单元格(个人笔记)