vue+handsontable合并单元格获取数据以及导出表格功能

首先我的handsontable数据格式是json数组

1.合并单元格获取合并后的数据:

 <HotTable :root="root" :settings="hotSettings" v-if="showTable" ref="hottable"

style="width:100%;height:300px;overflow:hidden;"></HotTable>

this.$refs.hottable.table.getPlugin('MergeCells').mergedCellsCollection.mergedCells

2.导出表格功能:

this.$refs.hottable.table.getData()此方法获取的结果是二维数组

导出表格的时候我需要这样的二维数组去导出表格

上代码:导出表格

exportExcel() {
      let sheetMerges = this.changeMergeCellsToSheet(this.hotSettings.mergeCells)
      aoaToExcel(this.hotSettings.getData,sheetMerges, this.selectTree.name)
},
changeMergeCellsToSheet(mergeCells){
      let merges = []
      mergeCells.forEach(item =>{
        if (item.rowspan !==1 || item.colspan !== 1){
          let tmp = {
            s: {//s为开始
              c: item.col,//开始列
              r: item.row//可以看成开始行,实际是取值范围
            },
            e: {//e结束
              r: item.row + item.rowspan-1,//结束列
              c: item.col + item.colspan-1//结束行
            }
          }
          merges.push(tmp)
        }
      })
      return merges;
}
export function aoaToExcel(aoa,mergeCells, fileName) {
  const wopts = {
    bookType: 'xlsx',
    bookSST: false,
    type: 'binary'
  }
  const workBook = {
    SheetNames: ['Sheet1'],
    Sheets: {},
    Props: {}
  }
  workBook.Sheets['Sheet1'] = XLSX.utils.aoa_to_sheet(aoa)
  workBook.Sheets['Sheet1']['!merges'] = mergeCells
  FileSaver.saveAs(new Blob([changeData(XLSX.write(workBook, wopts))],
    { type: 'application/octet-stream' }), fileName + '.xlsx')
}

function changeData(s) {
  if (typeof ArrayBuffer !== 'undefined') {
    let buf = new ArrayBuffer(s.length)
    let view = new Uint8Array(buf)
    for (let i = 0; i !== s.length; ++i) view[i] = s.charCodeAt(i) & 0xff
    return buf
  } else {
    let buf = new Array(s.length)
    for (let i = 0; i !== s.length; ++i) buf[i] = s.charCodeAt(i) & 0xff
    return buf
  }
}

猜你喜欢

转载自blog.csdn.net/weixin_43173924/article/details/89371827
今日推荐