ant design vue table 行合并和列合并

以行合并为例子:
ant design vue table 行合并和列合并_第1张图片
ant design vue table 行合并和列合并_第2张图片

ant design vue table 行合并和列合并_第3张图片

在需要合并的colums对应元素中写customRender函数并配置obj.attrs.rowSpan, 该属性设置为数字几则对应行就向下合并几行,而那些向下被合并的行则需要将该属性设置为0,如上图画圈部分代码意为把第三行的数据Home phone列向下合并2行。

列合并也一样。

需要注意的是:
如果要合并行或列需保证要合并的行或列数据是连续的。
如:出现要将某一列字段相同的行进行合并的情况,但是他们在现有的数组数据中并不是连续的,则要和后端进行交涉,让其处理好数据后再返回给我们。

你可能感兴趣的:(vue.js,javascript,前端框架,前端)