Vue + ElementUI Excel 导出功能

依赖安装

npm install --save xlsx file-saver

组件内引入

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

方法

<template>
    <el-table id="el-table"></el-table>
</template>

// 导出表格
exportExcel() {
    let time = new Date();
    let wb = XLSX.utils.table_to_book(document.querySelector('#el-table'));
    let wbout = XLSX.write(wb, {
        bookType: 'xlsx',
        bookSST: true,
        type: 'array'
    });

    try {
        FileSaver.saveAs(
            new Blob([wbout], { type: 'application/octet-stream' }),
            `名字 ${time.getTime()}.xlsx` // 文件名
        );
    } catch (e) {
        if (typeof console !== 'undefined') {
            this.$message.error('导出失败');
            console.log(e, wbout);
        }
    }

    return wbout;
}