项目中使用了 element-UI ,需要导出表格中的数据,主要用到了两个依赖:xlsx ,file-saver 。
相关git : https://github.com/SheetJS/js-xlsx,https://github.com/eligrey/FileSaver.js
- 安装依赖
npm install --save xlsx file-saver
- 组件中引入
import FileSaver from 'file-saver'
import XLSX from 'xlsx'
- 添加一个方法
exportExcel () {
//在导出的过程中发现数字的格式发生了变化,可以通过添加参数解决
var xlsxParam = { raw: true };//转换成excel时,使用原始的格式
// 需要导出的table的DOM节点
var wb = XLSX.utils.table_to_book(document.querySelector('#out-table'), xlsxParam)
var wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' })
try {
// sheetjs 导出的文件名,可以根据需要修改
FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), 'sheetjs.xlsx')
} catch (e) { if (typeof console !== 'undefined') console.log(e, wbout) }
return wbout
},
- 执行方法就可以得到表格对应的数据。