iView(View UI) Table行合并

官方文档 行/列合并

行/列合并

4.0.0 设置属性 span-method 可以指定合并行或列的算法。

该方法参数为 4 个对象：

• row: 当前行
• column: 当前列
• rowIndex: 当前行索引
• columnIndex: 当前列索引

该函数可以返回一个包含两个元素的数组，第一个元素代表 rowspan，第二个元素代表 colspan。 也可以返回一个键名为 rowspan 和 colspan 的对象。

但官方文档并没有说明rowspan和colspan是怎么回事，通过对官方的示例观察以及验证，得出以下结论：

rowspan=0 隐藏该行

rowspan=1 显示该行

rowspan>1 涉及合并的行数或者说合并rowspan-1的行数，需要注意的一点，它是从该行往下合并。

                   比如rowspan为3，则从这一行开始算，接下来三行会进行合并。

colspan没验证过，但规则应该是一致的，把行换成列，往下合并换成往右合并。

下面实现“通用”的iView Table行合并：

1. 基于 官方文档 行/列合并 的示例代码修改

2. 只适用于数据格式为“常见”的对象数组

[
  {
    "name": "Jim",
    "age": 18,
    "address": "Sydney",
    "date": "2016-10-03"
  },
  {
    "name": "Jim",
    "age": 24,
    "address": "London",
    "date": "2016-10-01"
  }
]

3. 想要忽略某一列的行合并，把columns的key对应push入ignoreMergeRow数组即可

4. 其他请查看代码注释

5. 代码仅供参考，如有更优雅的实现方式，请不吝赐教

代码： 

效果：

忽略name列的行合并