vue中使用js-xlsx匯出excel的實現方法

npm install --save xlsx file-saver

import FileSaver from 'file-saver'
import XLSX from 'xlsx'

exportExcel() {
      var xlsxParam = { raw: true };//轉換成excel時，使用原始的格式
      var wb = XLSX.utils.table_to_book(document.querySelector("#outTable"),xlsxParam);//outTable為列表id
      var wbout = XLSX.write(wb, {
        bookType: "xlsx",
        bookSST: true,
        type: "array"
      });
      try {
        FileSaver.saveAs(
          new Blob([wbout], { type: "application/octet-stream;charset=utf-8" }),
          "sheetjs.xlsx"
        );
      } catch (e) {
        if (typeof console !== "undefined") console.log(e, wbout);
      }
      return wbout;}

var _data = [
 
        [ "id",    "name", "value" ],
 
        [    1, "sheetjs",    7262 ],
 
        [    2, "js-xlsx",    6969 ]
 
      ];
      const ws= XLSX.utils.aoa_to_sheet(_data);
 
      /* generate workbook and add the worksheet */
      const wb = XLSX.utils.book_new();
      XLSX.utils.book_append_sheet(wb, ws, 'Sheet1');
 
      /* save to file */
      XLSX.writeFile(wb, 'SheetJS.xlsx');

exportExcel() {var wopts = {
        bookType: 'xlsx',
        bookSST: true,
        type: 'binary'
      };
      var workBook = {
        SheetNames: ['Sheet1'],
        Sheets: {},
        Props: {}
      };
      var table = [];
        for(var i=0;i<this.multipleSelection.length;i++){
          var params = {
            姓名: this.multipleSelection[i].name,
            部門: this.multipleSelection[i].department,
            職務名稱: this.multipleSelection[i].titles,
            檔案編號:this.multipleSelection[i].fileNum,
            校驗狀態:this.multipleSelection[i].verifyStatus,
            稽核狀態:this.multipleSelection[i].checkedStatus,
            備註:this.multipleSelection[i].checkedReason,
          }
          table[i] = params
      };
      //1、XLSX.utils.json_to_sheet(data) 接收一個物件陣列並返回一個基於物件關鍵字自動生成的「標題」的工作表，預設的列順序由使用Object.keys的欄位的第一次出現確定
      //2、將資料放入物件workBook的Sheets中等待輸出
      workBook.Sheets['Sheet1'] = XLSX.utils.json_to_sheet(table);
 
      //3、XLSX.write() 開始編寫Excel表格
      //4、changeData() 將資料處理成需要輸出的格式
      FileSaver.saveAs(new Blob([this.changeData(XLSX.write(workBook, wopts))], {type: 'application/octet-stream'}), "sheetjs.xlsx")
    },
     changeData(s) {
 
    //如果存在ArrayBuffer物件(es6) 最好採用該物件
    if (typeof ArrayBuffer !== 'undefined') {
 
      //1、建立一個位元組長度為s.length的記憶體區域
      var buf = new ArrayBuffer(s.length);
 
      //2、建立一個指向buf的Unit8檢視，開始於位元組0，直到緩衝區的末尾
      var view = new Uint8Array(buf);
 
      //3、返回指定位置的字元的Unicode編碼
      for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
      return buf;
 
    } else {
      var buf = new Array(s.length);
      for (var i = 0; i != s.length; ++i) buf[i] = s.charCodeAt(i) & 0xFF;
      return buf;
    }
  },

const workSheet = XLSX.utils.json_to_sheet(this.multipleSelection, {
    header: ['列1', '列2', '列3', '列1', '列2', '列3', '列1', '列2'], skipHeader: true// 跳過上面的標題行  
  });
  const ws = XLSX.utils.aoa_to_sheet(workSheet);
  const wb = XLSX.utils.book_new();
  XLSX
  .utils.book_append_sheet(wb, ws, 'Sheet1');/* save to file */
  XLSX
  .writeFile(wb, 'SheetJS.xlsx');