Vue3导出excel表格

 

目录

安装xlsx和file-saver

页面引入xlsx和file-saver

导出函数

调用

---

安装xlsx和file-saver

yarn add file-saver xlsx
//或
npm install file-saver -S
npm install xlsx -S

页面引入xlsx和file-saver

import * as XLSX from "xlsx";
import FileSaver from 'file-saver'

导出函数

//参数dom表示传入的表格dom节点，title表示导出的excel文件名称
const exData = (dom, title) => {
    let wb = XLSX.utils.table_to_book(dom, { raw: true })
    let wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' })
    try {
        FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), title + `.xlsx`)
    } catch (e) {
        if (typeof console !== 'undefined') {
            console.log(e, wbout)
        }
    }
    return wbout
}

调用

exData(document.querySelector('#table'), '薪资表');