vue2实现Blod文件流下载
实现思路:
动态创建一个a标签,模拟点击打开链接,实现下载
downLoad() {
//调用下载接口Export({Id: id}).then(res => {this.showLoading = false;if (res && res.data && res.data.returnCode == -1) {this.msgError(res.data.returnMessage || "下载失败");return;}// 大批量导出var blob = new Blob([res.data], {//这个里面的data 的二进制文件 创建一个文件对象type: "application/vnd.ms-excel;charset=utf-8"});var downloadElement = document.createElement("a"); //创建一个a 虚拟标签var href = window.URL.createObjectURL(blob); // 创建下载的链接downloadElement.href = href;downloadElement.download ="模板.xlsx"; // 下载后文件名document.body.appendChild(downloadElement);downloadElement.click(); // 点击下载document.body.removeChild(downloadElement); // 下载完成移除元素window.URL.revokeObjectURL(href); // 释放掉blob对象}).catch(() => {this.showLoading = false;});},
封装的接口要加响应类型 responseType: "blob" 要求返回blod类型数据