需求
最近有个需求就是要批量下载 Excel,然后接口参数需要列表的表头信息,参数数据有点大,接口需要 post 方式处理
在实现这个功能之前,我们先了解一下 blob 这个东东
Blob
Blob 是对大数据的不透明引用或者句柄。
名字来源于 SQL 数据库,表示二进制大对象
(Binary Large Object)。
在 JavaScript 中 Blob 通常表示二进制数据,也可以表示一个小型文本文件的内容。
Blob 有大小 size (单位:字节),MIME类型
Web 浏览器可以将 Blob 存储到内存中或者磁盘上。
实现
import axios from 'axios'; import qs from 'qs'; export function exportListData(url, params){ axios({ method: 'POST', url: url, data: qs.stringify(params), headers: { 'access-token': getCookie('access-token') }, responseType: 'blob' }).then(res => { const link = document.createElement('a'); // 创建元素 console.log("获取的数据============》",res); let blob = new Blob([res], { type: 'application/x-download' }); link.style.display = 'none'; link.href = URL.createObjectURL(blob); // 创建下载的链接 link.setAttribute('download', '测试数据.xls'); // 给下载后的文件命名 document.body.appendChild(link); link.click(); // 点击下载 document.body.removeChild(link); // 下载完成移除元素 window.URL.revokeObjectURL(link.href); // 释放掉blob对象 }).catch(err => {}); }