將數據保存(導出)到excel文件(純前端實現)


// 導出excel文件
    /**
     * 依賴: import XLSX from 'xlsx'
     */
    let obj = {
      '學生信息表': [
        ['姓名', '性別', '年齡', '分數'],
        ['張三', '男', 18, parseInt(Math.random() * 100)],
        ['李四', '女', 22, parseInt(Math.random() * 100)]
      ],
      '教師信息表': [
        ['姓名', '性別', '年齡', '教齡'],
        ['王五', '男', 18, parseInt(Math.random() * 10), new Date()],
        ['牛六', '女', 22, parseInt(Math.random() * 10)]
      ]
    }
    let arr = [
      ['姓名', '性別', '年齡', '教齡'],
      ['王五', '男', 18, parseInt(Math.random() * 10)],
      ['牛六', '女', 22, parseInt(Math.random() * 10)]
    ]
    this.downloadXlsx(obj, 'result', '信息表')
    downloadXlsx (data, fileName, sheetName) {
      fileName = (fileName || 'fileName') + '.xlsx'
      sheetName = sheetName || 'sheet1'
      download(data2blob(data, sheetName), fileName)
      this.readWorkbookFromLocalFile(sheet2blob(data, sheetName), res => {
        console.log(res)
      })
      //   下載excel文件
      function download (url, fileName) {
        if (typeof url == 'object' && url instanceof Blob) {
          url = URL.createObjectURL(url) // 創建blob地址
        }
        let element = document.createElement('a')
        element.href = url
        element.download = fileName // HTML5新增的屬性,指定保存文件名,可以不要后綴,注意,file:///模式下不會生效
        element.style.display = 'none'
        element.click()
      }
      // 利用xlsx提供的方法將對象轉成blob
      function data2blob (data, sheetName) {
        let workbook = {
          SheetNames: [],
          Sheets: {}
        }
        if (data instanceof Array) {
          workbook.SheetNames = [sheetName]
          workbook.Sheets[sheetName] = XLSX.utils.aoa_to_sheet(data)
        } else if (data instanceof Object) {
          for (const key in data) {
            if (data.hasOwnProperty(key)) {
              const arr = data[key]
              if (arr instanceof Array) {
                workbook.SheetNames.push(key)
                workbook.Sheets[key] = XLSX.utils.aoa_to_sheet(arr)
              } else throw new Error('數據格式不正確')
            }
          }
        }
        // 生成excel的配置項
        let wopts = {
          bookType: 'xlsx', // 要生成的文件類型
          bookSST: false, // 是否生成Shared String Table,官方解釋是,如果開啟生成速度會下降,但在低版本IOS設備上有更好的兼容性
          type: 'binary'
        }
        let wbout = XLSX.write(workbook, wopts)
        let blob = new Blob([s2ab(wbout)], { type: "application/octet-stream" })
        // 字符串轉ArrayBuffer
        function s2ab (s) {
          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
        }
        return blob
      }
    }


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM