el-table 动态向下合并单元格

el-table 动态向下合并单元格

  mergeCol(productDesc, rowIndex) {
      var idName = this.tData[rowIndex][productDesc]
      if (rowIndex > 0) {
        if (this.tData[rowIndex][productDesc] !== this.tData[rowIndex - 1][productDesc]) {
          var i = rowIndex
          var num = 0
          while (i < this.tData.length) {
            if (this.tData[i][productDesc] === idName) {
              i++
              num++
            } else {
              i = this.tData.length
            }
          }
          return {
            rowspan: num,
            colspan: 1
          }
        } else {
          return {
            rowspan: 0,
            colspan: 1
          }
        }
      } else {
        let i = rowIndex
        let num = 0
        while (i < this.tData.length) {
          if (this.tData[i][productDesc] === idName) {
            i++
            num++
          } else {
            i = this.tData.length
          }
        }
        return {
          rowspan: num,
          colspan: 1
        }
      }
    },
    spanMethod({ row, column, rowIndex, columnIndex }) {
      // productDesc 这个字段的值相同则向下合并
      switch (columnIndex) {
        case 0:
          return this.mergeCol('productDesc', rowIndex)
        case 1:
          return this.mergeCol('productDesc', rowIndex)
      }
    }