效果图
1、vxe table/grid 用这个属性
:merge-cells="mergeCells"
2、数据里面找到要合并的行
let mergelist = this.dataList.filter(item=>item.px=='1').map(item=>item.idx);
this.mergeCells=[];//处理分页后跨行乱的问题,需要重新初始化
for (let i = 0; i < mergelist.length; i++) {
this.mergeCells.push({row:Number(mergelist[i])-1,col:0,rowspan:0,colspan:4});
}
3、修改跨行里面显示的格式,字段组合
for(var item of tabhead) {
if (item.field == "lx") {
item.slots = {
// 使用 JSX 渲染
default: ({row}) => {
if(row.lx=="hz"){
return [
<div>
<span style="font-weight:bold;">{row.gysmc}:</span>
<span style="color:red;font-weight:bold;">{row.sjhj.toFixed(2)} 元</span>
</div>
]
}else{
return [<span>{row.lx}</span>];
}
}
}
}