js 导出excel文件
一般来说,导出有2种实现方式:
- 直接放
a
标签里,通过href
属性向后端发送请求导出
<a href="url">导出</a>
很明显的缺点:文件名不正确,是一串字符串。所以需要使用第二种方法。
- 需要进行数据处理的情况:手动
coding
发送请求的代码,将返回的 blob 对象导出。
问题来了:如何导出呢?好像没有思路-_-
好好思考:- 由方法一知:
a
标签可以直接导出。
那么js
应该可以模拟一个a
标签。 -
url
哪里来呢?
createObjectURL可以将blob
对象转换为url
,可以像普通的url
一样使用。 - 最后一个问题:如何导出
excel
格式呢?
MDN
告诉我:用Blob 构造函数声明MIME类型就好。
- 由方法一知:
思路整理好了,一步步实现呗:
this.$axios.get("XXX", {
params,
responseType: "blob",
})
.then((res) => {
let blob = new Blob([res.data], {
type: "application/vnd.ms-excel",
});
let fileName = "导出.xls";
let link = document.createElement("a");
link.href = window.URL.createObjectURL(blob);
link.download = fileName;
link.click();
// 移除url
window.URL.revokeObjectURL(link.href);
//移除标签
document.body.removeChild(link)
})
一个编码好习惯:及时清除已执行完的变量,释放内存。
总结
coding
难的是思路,也需要过硬的知识储备。多多学习呀!
发表评论 (审核通过后显示评论):