使用FileSaver 和XLSX把dom中table的数据导出
本方法只能导出页面上已经渲染的表格,因为他是操作dom去查找信息
如何导出json数据参考下面这两个:
原生js乱序导出json为excel https://github.com/sunhuihuibuhui/JavaScript-export-Excel 这个方法导出的表头顺序是随机的不能自己调整
vue使用插件完美导出excel https://github.com/sunhuihuibuhui/vue-Blob-Export2Excel 这个方法导出的表格信息可以自己设置
欢迎star~
1:安装依赖
npm i xlsx file-saver --save
npm i xlsx --save
npm i script-loader --save-dev
2:引入
import FileSaver from 'file-saver'
import XLSX from 'xlsx'
3:导出的函数如下
exportExcel () {
var wb = XLSX.utils.table_to_book(document.querySelector('.listOuter'))
var wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' })
try {
FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), 'sheetjs.xlsx')
} catch (e) {
if (typeof console !== 'undefined') console.log(e, wbout)
}
return wbout
}
下图有注释部分