polymer实现动态数据并且带有表格合并

---

最近接到一个需求，就是要做一个页面放个表格来显示数据，并且数据条数是动态并且规定格式且带合并的；
首先看效果图：

1. 服务返回的数据结构：

data: {
    type: Array,
    value: [{
        "designation": "001",
        "rows": [{
            "manufacturerName": "广州",
            "manufacturerId": 100,
            "myProductOffers":[{"a": "供应商","b": "期/现货",...}],
            "todayDealPrice": [{"a": "供应商","b": "期/现货",...}],
            "otherProductOffers":[{"a": "供应商","b": "期/现货",...}],
        }]

2. 页面代码是这样子的：

这里要注意的是每一层循环的index，利用这个index来判断合并的项是第一个的时候显示就可以了

3. 对应的js代码：

_getDataLength: function (data) {
    let length = 0;
    data.rows.forEach(e=>{
        length += e.myProductOffers.length
        length += e.todayDealPrice.length  
        length += e.otherProductOffers.length
    })

    return length
},
_getRowsLength: function (rows) {
    let length = rows.myProductOffers.length+ rows.todayDealPrice.length+rows.otherProductOffers.length;
    return length
},
_getArrayLength: function (rows) {
    return rows.length
},
_isFirstRow:function (index) {
    return index === 0
}