1.npm安装
npm install xlsx --save
npm install file-saver --save
2.创建export.js
import FileSaver from 'file-saver'
import * as XLSX from 'xlsx'
export default {
/*
*导出Excel表格
*name--导出文件名
*tableName--导出表id(#id)
*示例 this.myExport('行驶数据明细','#myTable',17)
*/
exportExcel(name, tableName) {
var myName = name + '.xlsx'
var xlsxParam = { raw: true } //数据不转换格式
var sel = XLSX.utils.table_to_book(document.querySelector(tableName), xlsxParam)
var selIn = XLSX.write(sel, { bookType: 'xlsx', bookSST: true, type: 'array' })
try {
FileSaver.saveAs(new Blob([selIn], { type: 'application/octet-stream' }), myName)
} catch (e) {
if (typeof console !== 'undefined') console.log(e, selIn)
}
return selIn
}
}
3.补充
(1)若想导出多个sheet页,可用如下workbook替换sel
let workbook = XLSX.utils.book_new();
let ws1 =XLSX.utils.table_to_sheet(document.querySelector('#tableId1'), xlsxParam);
let ws2 = XLSX.utils.table_to_sheet(document.querySelector('#tableId2'), xlsxParam);
// 这里可以添加多个sheet页
XLSX.utils.book_append_sheet(workbook, ws1, 'Excel名称');
XLSX.utils.book_append_sheet(workbook, ws2, 'Excel名称');
(2)过滤导出列
实现思路,在导出前,将不想导出列隐藏(v-if),再在this.$nextTick中实现导出,在导出后,恢复隐藏列
(3) 此方法只能导出当前页