vue+elementui的table合并行

最新推荐文章于 2024-08-13 23:10:15 发布

肖肖肖丽珠

最新推荐文章于 2024-08-13 23:10:15 发布

阅读量1.7k

点赞数 4

分类专栏： vue element-ui

本文链接：https://blog.csdn.net/qq_33769914/article/details/106926682

版权

本文介绍如何在使用Vue.js和ElementUI时，根据数据动态合并表格的行。通过给每个表格数据项增加一个代表行和列合并数的属性，并提供一个函数`mergeTableRow`来处理合并逻辑。在组件的`mounted`生命周期钩子中调用此函数，结合`arraySpanMethod`方法，可以实现基于`clsid`字段的行合并。

摘要由CSDN通过智能技术生成

一个班级下面可以有多个试卷。这时候我们要根据班级的id来确定合并的行数。班级id一样的要合并。

tableData: [ {
          classname: '2018年暑假班一年级语文小班兴趣',
          clsid: '123',
          title: '2020/06/18 20:21:12 测试 (4)题',
        }, {
          classname: '2018年暑假班一年级语文小班兴趣',
          clsid: '123',
          title: '2020/06/18 20:21:12 测试 (4)题',
        }, {
          classname: '2017年暑假班一年级语文小班兴趣',
          clsid: '1234',
          title: ' 语文期末试卷',
        }, {
          classname: '2019年暑假班一年级语文小班兴趣',
          clsid: '12345',
          title: '测试卷',
        }],