如何实现Element Table中行动态合并与数据编辑功能示例？

本文共计3192个文字，预计阅读时间需要13分钟。

目录+正文+思路+1：第二列和第三列第四列根据名称进行合并+2：可以动态编辑第三列和第四列+3：第一列的数据是第三列相加得到+4：弹出一个输入框+完整代码+英文+先描述一下

目录

• 正文
• 思路
• 1：第二列和第三列第四列根据名称进行合并
• 2：可以动态编辑第三列和第四列解决
• 3：第一列的数据是根据第三列相加得来的
• 4：弹出个输入框
• 完整代码

正文

先描述一下需求,看下图

1：动态合并行，如图所示，第一列全部合并，第二列和第三列第四列根据名称进行合并

2：可以动态编辑第三列和第四列，并且只能编辑属于此合并行的第三列和第四列，比如第一个编辑按钮点击后，只有前三行可以编辑

3：第一列的数据是根据第三列相加得来的

4：点击快捷填写，可以快速填写第三列和第四列

思路

1：第二列和第三列第四列根据名称进行合并

后台根据名称进行排序，前台通过循环解析名称来知道哪一行需要合并，这个从网上找了一个自己改了下。