vue 合并el-table单元格

1.使用方法:

created() {
//xx:在table表格里面要合并的字段
//tableData:el-table 绑定的data
 this.tableData = this.mergeTableRow(this.tableData, ['xx','xx')
}

 

2.main.js写入

Vue.prototype.mergeTableRow = function(data, merge) {
  if (!merge || merge.length === 0) {
    return data
  }
  merge.forEach((m) => {
    const mList = {}
    data = data.map((v, index) => {
      const rowVal = v[m]
      if (mList[rowVal] && mList[rowVal].newIndex === index) {
        mList[rowVal]['num']++
        mList[rowVal]['newIndex']++
        data[mList[rowVal]['index']][m + '-span'].rowspan++
        v[m + '-span'] = {
          rowspan: 0,
          colspan: 0
        }
      } else {
        mList[rowVal] = {
          num: 1,
          index: index,
          newIndex: index + 1
        }
        v[m + '-span'] = {
          rowspan: 1,
          colspan: 1
        }
      }
      return v
    })
  })
  return data
}

 

posted @ 2020-06-18 17:19  沦陷吖  阅读(2144)  评论(0编辑  收藏  举报