vue.js 实现表格合并

正常表格：

<tr v-for="item in items">
 <td>{{ $index + 1 }}</td>
 <td>{{item.bsO_Name}}</td>
 <td >{{item.GathDt | time}}</td>
 <td>{{item.F1}}</td>
 <td >{{item.F2}}</td>
 <td >{{item.F4}}</td>
 <td >{{item.F3}}</td>

</tr>

合并修改代码:

<tr v-for="item in items">
 <td>{{ $index + 1 }}</td>
 <td :rowspan="item.bsO_Namespan" :class="{hidden: item.bsO_Namedis}">{{item.bsO_Name}}</td>
 <td  :rowspan="item.GathDtspan" :class="{hidden: item.GathDtdis}" >{{item.GathDt | time}}</td>
 <td  :rowspan="item.F1span"  :class="{hidden: item.F1dis}">{{item.F1}}</td>
 <td  :rowspan="item.F2span"  :class="{hidden: item.F2dis}">{{item.F2}}</td>
 <td  :rowspan="item.F3span"  :class="{hidden: item.F3dis}">{{item.F3}}</td>
</tr>

合并：

list：请求回来的数据

combineCell:function (list) {
 for (field in list[0]) {
  var k = 0;
  while (k < list.length) {
   list[k][field + 'span'] = 1;
   list[k][field + 'dis'] = false;
   for (var i = k + 1; i <= list.length - 1; i++) {
    if (list[k][field] == list[i][field] && list[k][field] != '') {
     list[k][field + 'span']++;
     list[k][field + 'dis'] = false;
     list[i][field + 'span'] = 1;
     list[i][field + 'dis'] = true;
    } else {
     break;
    }
   }
   k = i;
  }
 }
 return list;
}