vue合并单元格

页面元素

          <td
            v-if="item.groupMarkRowSpan != '0'"
            :rowspan="item.groupMarkRowSpan"
          >
            {{ item.examModel }}
          </td>

js

        this.combineRow(["groupMark"]);

 combineRow(cols) {
      cols.forEach((key) => {
        for (var i = 0; i < this.tableData.length; i++) {
          const item = this.tableData[i];
          let count = 1;
          for (let j = i + 1; j < this.tableData.length; j++) {
            // 如果是同一个值，往后递增
            if (item[key] != 0) {
              if (item[key] === this.tableData[j][key]) {
                count++;
                // 往后相同的值都设为空单元格
                this.tableData[j][`${key}RowSpan`] = 0;
                // 只有同值第一个才设置合并的单元格数
                item[`${key}RowSpan`] = count;
                // 所有都是为同一个值的情况
                // 如果到了尾部，则循环结束
                if (j === this.tableData.length - 1) {
                  return;
                }
              } else {
                // 指针跳转到下一个，从下一排开始
                i = j - 1;
                count = 1;
                this.tableData[j][`${key}RowSpan`] = count;
                break;
              }
            }
          }
        }
      });
    },