前端请求的时候
1.设置返回类型reponseType,使用blob类型接收。还有post请求要设置content-type:multipart/from-data(跟文件上传一样,是接收文件的)
responseType: "blob", // 表明返回服务器返回的数据类型
如果是post请求,则需要设置content-type(请求头):
headers:{
"content-type":"multipart/from-data",
}
2.利用a标签自定义下载文件名
const link = document.createElement("a");
3.创建Blob对象,设置文件类型
let blob = new Blob([res], { type: "application/vnd.ms-excel" });
4.就是设置链接,自定义文件名字
link.style.display = "none";
//设置连接
link.href = URL.createObjectURL(blob);
link.download = "田间实时数据.xls";
document.body.appendChild(link);
//模拟点击事件
link.click();
5.整体代码如下
exportData() {
this.Axios({
method: "get",
url: "/api/field/exportData",
responseType: "blob", // 表明返回服务器返回的数据类型
})
.then((res) => {
console.log(res, "导出数据");
const link = document.createElement("a");//利用a标签自定义下载文件名
let blob = new Blob([res], { type: "application/vnd.ms-excel" });//创建Blob对象,设置文件类型
link.style.display = "none";
//设置连接
link.href = URL.createObjectURL(blob);
link.download = "田间实时数据.xls";//自定义文件名字
document.body.appendChild(link);
//模拟点击事件
link.click();
})
.catch((err) => {
console.log(err);
});
},