最近遇到了需要在vue环境中导出element的table的问题。
原文:https://blog.csdn.net/u010427666/article/details/79208145
步骤如下:
首先安装两个插件
1 |
npm install --save xlsx file-saver |
然后在需要的页面引入功能
1 2 |
import FileSaver from 'file-saver' import XLSX from 'xlsx' |
然后点击导出按钮执行功能:
1 2 3 4 5 6 7 8 9 10 |
exportExcel () { /* table-id为所需导出table的id */ var wb = XLSX.utils.table_to_book(document.querySelector('#table-id')) /* get binary string as output */ var wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' }) try { FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), '导出的文件.xlsx') } catch (e) { if (typeof console !== 'undefined') console.log(e, wbout) } return wbout } |