[JavaScript知识库]vue模板下载三种方法

用vue2针对后台返回数据的不同提供的下载模板文件三种办法（针对Excel）

一、当后台返回的数据是文件时，以下代码可实现直接下载文件到本地

let ele = document.createElement(“a”);
ele.style.display = “none”;
let file = “/user/exportExcelData”;//下载文件的后台接口
ele.href =file;
document.body.appendChild(ele);
ele.click();
document.body.removeChild(ele);

二、当调用接口后台返回的数据是文件流（二进制文件）时，以下代码可实现对二进制文件进行处理并且进行下载文件到本地；

let res= await DownloadService.get2(name);//封装的后台接口API（name是返回的文件名）
let blob= new Blob([res.data], {//res.data是后台返回的二进制文件
type: “application/vnd.ms-excel;”//定义文件类型
// type: “application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8”
});
let url= URL.createObjectURL(blob);
let link= document.createElement(‘a’);
link.setAttribute(“href”, url);
link.setAttribute(“download”, name);
link.style.visibility = ‘hidden’;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);

三、当后台返回的数据是文件时，以下代码亦可实现直接下载文件到本地

window.open(’_blank’).location.href = “http://10.80.58.79:8003/user/exportException/”+ name//name是文件名，可在新窗口中打开并且下载文件。