1,安装插件
npm install --save xlsx file-saver
2,在文件中使用
import FileSaver from 'file-saver'
import XLSX from 'xlsx'
3,out-table是表格的id
outTab () {
/* generate workbook object from table */
let wb = XLSX.utils.table_to_book(document.querySelector('#out-table'))
/* get binary string as output */
let 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
},
如果
使用el-table的fixed属性时,会导致生成2份数据
解决方法:
/* generate workbook object from table */
let fix = document.querySelector('.el-table__fixed');
let wb;
if (fix) {
wb = XLSX.utils.table_to_book(document.querySelector("#out-table").removeChild(fix));
document.querySelector("#out-table").appendChild(fix);
} else {
wb = XLSX.utils.table_to_book(document.querySelector("#out-table"));
}
/* get binary string as output */
let wbout = XLSX.write(wb, {
bookType: 'xlsx',
bookSST: true,
type: 'array'
});
try {
FileSaver.saveAs(new Blob([wbout], {
type: 'application/octet-stream'
}), 'file.xlsx');
} catch (e) {
if (typeof console !== 'undefined') console.log(e, wbout)
}
return wbout;
需要注意的是:纯前端导出的话 会将百分比变成了小数 解决办法是 在获取表格的时候设置:
{ raw: true }
const wb = XLSX.utils.table_to_book(document.querySelector('#table-ref'), { raw: true })