vue+elementui 使用表格XLSX.utils导出数据重复

1.产生的原因:表格中使用了fixed,固定列,fixed的表格显示效果有两个table组成,其中一个隐藏,一个显示。

2.解决办法:导出时去掉fixed表格。

 handleDownload() {
      /* 从表生成工作簿对象 :使用了fixed,导致导出数据叠加了 去除其中的el-table__fixed*/
      var fix = document.querySelector('.el-table__fixed');
      var wb;
      let tempNode = document.querySelector("#month-bad-report-table")
      if (fix) {
        wb = XLSX.utils.table_to_book(tempNode.removeChild(fix));
        tempNode.appendChild(fix);
      } else {
        wb = XLSX.utils.table_to_book(document.querySelector("#month-bad-report-table"));
      }
      var wbout = XLSX.write(wb, {
        bookType: "xlsx",
        bookSST: true,
        type: "array",
      });
      try {
        FileSaver.saveAs(
          new Blob([wbout], {type: "application/octet-stream"}),
           "tableName.xlsx"
        );
      } catch (e) {
        if (typeof console !== "undefined") console.log(e, wbout);
      }
      return wbout
    }

猜你喜欢

转载自blog.csdn.net/qi95719/article/details/129140962
今日推荐