前端導出excel（安裝xlsx）
demo 地址https://sheetjs.com/demo/manifest.html
案列
1. 將頁面的table 元素 變成excel文件並下載
import XLSX from "xlsx"
createElsx(){
// 獲取表格的dom元素
var elt = document.getElementsByTagName('table')[0];
console.log(elt)
// 將表格的dom 元素轉化為 excel工作薄
var wb = XLSX.utils.table_to_book(elt, {sheet:"Sheet JS"});
// 將工作薄導出為excel文件
XLSX.writeFile(wb,'呵呵噠.xlsx');
}
2. 將數據轉化為數組 進行導出
import XLSX from "xlsx"
createElsx(){
let arr =[
["序號",'姓名','年紀'],
["0",'呵呵噠','15'],
["1",'12313','15'],
]
// 將數組轉化為標簽頁
var ws = XLSX.utils.aoa_to_sheet(arr);
// 創建工作薄
var wb = XLSX.utils.book_new()
// 將標簽頁插入到工作薄里
XLSX.utils.book_append_sheet(wb,ws)
// 將工作薄導出為excel文件
XLSX.writeFile(wb,'呵呵噠.xlsx');
}
3.如果excel數據非常大
后端將數據變成excel 前端直接下載這個文件
a.后端產生excel
let sheet =XLSX.utils.aoa_to_sheet(arr)
let book = XLSX.utils.book_new()
XLSX.utils.book_append_sheet(book,sheet)
XLSX.writeFile(book,'hehe.xlsx')
// 返回數據的接口
app.get('/getelsx',(req,res)=>{
let file = fs.readFileSync('./hehe.xlsx')
// 讓文件作為附件的形式下載
res.attachment('商品.xlsx')
res.send(file)
})
app.listen(3000,()=>{
console.log("server start")
})
b.前端進行下載
<button onclick='download()'>open下載</button>
<iframe name='myFrame' style="display:none;"></iframe>
<script>
function download(){
window.open('http://localhost:3000/getelsx','myFrame')
}
</script>
注意：通過iframe可以不讓瀏覽器閃一下