// 获取信息
const getSocDept = (deptId) => {
state.drawerLoading = true;
socDeptDeptInfo(deptId)
.then((res) => {
state.drawerForm = res.data;
state.drawerLoading = false;
resetSpanArr();
})
.catch(() => {
state.drawerLoading = false;
});
};
function resetSpanArr() {
let contactDot = 0;
state.spanArr = [];
state.drawerForm.socTenantDTOList.forEach((item, index) => {
//遍历tableData数据,给spanArr存入一个1,第二个item.id和前一个item.id是否相同,相同就给
//spanArr前一位加1,spanArr再存入0,因为spanArr为n的项表示n项合并,为0的项表示该项不显示,后面有spanArr打印结果
if (index === 0) {
state.spanArr.push(1);
} else {
if (
item.tenantId === state.drawerForm.socTenantDTOList[index - 1].tenantId
) {
state.spanArr[contactDot] += 1;
state.spanArr.push(0);
} else {
contactDot = index;
state.spanArr.push(1);
}
}
});
console.log('state.spanArr-----------', state.spanArr);
}
function objectSpanMethod({ row, column, rowIndex, columnIndex }) {
console.log(rowIndex, columnIndex);
if (columnIndex === 0 || columnIndex === 1) {
const _row = state.spanArr[rowIndex];
const _col = _row > 0 ? 1 : 0;
console.log(_row, _col);
//该形式为行合并
return {
rowspan: _row,
colspan: _col,
};
}
}
vue el-table合并单元格
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- 合并单元格,如果id列值一致,则合并 原理 1、getSpanArr(data)方法 data就是我们从后台拿到的...
- 合并单元格,如果id列值一致,则合并 1、getSpanArr(data)方法 data就是我们从后台拿到的数据,...
- 需求说明:合并相同项单元格部分单元格合并需要额外叠加条件可动态增减 实现思路通过倒序遍历数组,符合条件时使用com...
- 一、功能 1、合并行2、循环列 备注:数组第一层某些字段公用(depart_id,depart_name)、tea...
- 0 动态合并单元格方法本文写的有点繁琐,以下这篇文章将提供更简单的实现办法 el-table 动态合并单元格[ht...