vue table表格纵向合并

一, 先创建合并规则所需要的数据

          this.hbArrFirCol = []
          let newArr = JSON.parse(JSON.stringify(res.result.records))
          let id = JSON.parse(JSON.stringify(newArr[0].id))
          let num = 0
          newArr.forEach((item, index) => {
            if (id === item.id) {
              num++
            } else {
              this.hbArrFirCol.push({ num: num, index: index - num })
              id = item.id
              num = 1
            }
          })
          if (id === JSON.parse(JSON.stringify(newArr[0].id))) {
            this.hbArrFirCol.push({ num: num, index: 0 })
          }
          let val = this.hbArrFirCol[this.hbArrFirCol.length - 1]['num'] * 1 + this.hbArrFirCol[this.hbArrFirCol.length - 1]['index'] * 1
          this.hbArrFirCol.push({ num: num, index: val })

 二,合并规则

    /**
     * 合并规则
     */
    objectSpanMethod ({ row, column, rowIndex, columnIndex }) {
      if ([1, 2, 3, 4, 8].includes(columnIndex)) {
        for (let j = 0; j < this.hbArrFirCol.length; j++) {
          for (let i = (this.hbArrFirCol[j]['index'] + 1); i < (this.hbArrFirCol[j]['index'] + this.hbArrFirCol[j]['num']); i++) {
            if (rowIndex === this.hbArrFirCol[j]['index']) {
              return [this.hbArrFirCol[j]['num'], 1]
            } else if (rowIndex === i) {
              return [0, 0]
            }
          }
        }
      }
    }