vue使用xlsx多sheet导出excel

300 阅读1分钟

1 下载依赖

npm install xlsx

2 创建公用导出excel方法exportExcel.js

import * as XLSX from 'xlsx'
    export  const download =  (data,filename) =>{
        data.forEach(el => {
            const sheet = XLSX.utils.json_to_sheet(el.sheetData)
            XLSX.utils.book_append_sheet(wb, sheet, `${el.ip}${el.dbType}`)
            
        });
        const workbookBlob = workbook2blob(wb)
        console.log(workbookBlob,'workbookBlob')
        // 导出最后的总表
        // openDownloadDialog(workbookBlob, filename)
         return workbookBlob
    }

    const  workbook2blob  = (workbook) => {
        // 生成excel的配置项
        const wopts = {
            // 要生成的文件类型
            bookType: 'xlsx',
            // // 是否生成Shared String Table,官方解释是,如果开启生成速度会下降,但在低版本IOS设备上有更好的兼容性
            bookSST: false,
            type: 'binary'
        }
        const wbout = XLSX.write(workbook, wopts)
        // 将字符串转ArrayBuffer
        function s2ab (s) {
            const buf = new ArrayBuffer(s.length)
            const view = new Uint8Array(buf)
            for (let i = 0; i !== s.length; ++i) view[i] = s.charCodeAt(i) & 0xff
            return buf
        }
        const blob = new Blob([s2ab(wbout)], {
            type: 'application/octet-stream'
        })
        return blob
    }

    const openDownloadDialog  = (blob, fileName) => {
      if (typeof blob === 'object' && blob instanceof Blob) {
        blob = URL.createObjectURL(blob) // 创建blob地址
      }
      const aLink = document.createElement('a')
      aLink.href = blob
      // HTML5新增的属性,指定保存文件名,可以不要后缀,注意,有时候 file:///模式下不会生效
      aLink.download = fileName || '' ;
      let event
      if (window.MouseEvent) event = new MouseEvent('click')
      //   移动端
      else {
        event = document.createEvent('MouseEvents')
        event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null)
      }
      aLink.dispatchEvent(event)
    }

3 使用

(1)引入导出方法

import { download } from '@/js/exportExcel'

(2) 创建数据并使用

let data = [
{
name:'sheet',
list:[
   {  
       id: '1',
       name: 'zhang',
    },
{  
       id: '2',
       name: 'wang',
    },
]
},{
name:'sheet2',
list:[
   {  
       id: '3',
       name: 'li'
    },
{  
       id: '4',
       name: 'zhao',
    },
]
}]
download (data,filename)