vue实现将表格中的数据导出到excel中 本人亲测可用

vue实现将表格中的数据导出到excel中 本人亲测可用

1.首先创建一个js文件用来保存导出的方法 文件名叫Export2Excel.js

// 导入依赖
import FileSaver from 'file-saver';
import * as XLSX from 'xlsx';
 
/**
 * 导出Excel表格
 * @param name 生成excel的文件名，如：interestTable.xlsx
 * @param tableName 表格的id，如：#tableId
 * */
export const exportExcel = (name, tableName) => {
    let sel = XLSX.utils.table_to_book(document.querySelector(tableName))
    let selIn = XLSX.write(sel, { bookType: 'xlsx', bookSST: true, type: 'array' })
 
    try {
        FileSaver.saveAs(new Blob([selIn], { type: 'application/octet-stream' }), name)
    } catch (e) {
        if (typeof console !== 'undefined') console.log(e, selIn)
    }
 
    return selIn
}

2.在需要导出的界面进行如下操作
import { exportExcel } from ‘@/utils/Export2Excel’
在导出按钮绑定事件，具体的事件内如如下：

exportExcel('报表导出二.xlsx','#xueyuan');

亲测可用即可完成