vue3 导出excl文件
vue,表格导出成excl表格
·
后台管理系统经常有表格文件导出为excl的需求,在这里记录一下.
这里用到了两个包(file-server,XLSX), 今天项目中遇到这个需求了,但是用这个导出的时候出了问题,在安装的时候没有指定包版本,安装了最新版本,导致XLSX引入报undefined的问题,可能是新版本不兼容的问题
安装
npm install xlsx@0.16.0 file-saver@2.0.2 --save
//引入文件
import FileSaver from 'file-saver'
import XLSX from 'xlsx'
// 转换成excel时,使用原始的格式
let xlsxParam = { raw: true }
// 设置当前日期
let time = new Date()
let year = time.getFullYear()
let month = time.getMonth() + 1
let day = time.getDate()
let name = year + '' + month + '' + day
// console.log(name)
/* generate workbook object from table */
// .excelTable要导出的是哪一个表格 注意这里的 excelTable 是要导出的表格的类名
let wb = XLSX.utils.table_to_book(document.querySelector('.excelTable'), xlsxParam)
/* get binary string as output */
let wbout = XLSX.write(wb, {
bookType: 'xlsx',
bookSST: true,
type: 'array'
})
try {
// name+'.xlsx'表示导出的excel表格名字
FileSaver.saveAs(
new Blob([wbout], { type: 'application/octet-stream' }),
name + '.xlsx'
)
} catch (e) {
if (typeof console !== 'undefined') {
// console.log(e, wbout)
this.$message({
message: e + wbout,
type: 'error'
})
}
}
return wbout
更多推荐
已为社区贡献3条内容
所有评论(0)