Element 表格动态合并并行或列的方式(span-method) vue3版本

224 阅读1分钟

在项目开发过程,难以避免会有表格动态合并行或列的需求,Elemnent-push官网的 demo 是针对静态情况合并的,并不符合我们大部分人的动态需求,故今天整理出一份,我业务逻辑代码里如何处理表格动态合并的资料, Snipaste_2023-03-15_00-24-44.png

//思路 表格上添加:span-method方法

第一步先看拿到的数据

3.png 第二步:结合官网给出的方法并改进 //思路 先获取第一行数据,然后循环判断第二行的原库位字段是否与第一行原库位字段时候相同,需要相同则,spanArrName的第一项加1,否则判断从第二行数据开始,依次向后比对。最终获取到的spanArrName是一个跟表格数据相同长度的数组,数组的每一项就是需要合并的单元格数量。 data.spanArrName =[] 4.png

第三步---直接上代码

5.png

4.效果图

6.png