因为是文件流下载,所以在取后台数据的时候,要多传递一个【responseType: ‘blob’】这个参数
后端返回的文件流:
代码如下:
reportTable(val) {
this.$axios.service({
method: "post",
url: '/test/downloadZip',
data: {reportAllotMonthId:val.id,name:val.reportFormName,month:val.month},
headers: {
"content-type": "application/json; charset=utf-8",
token: sessionStorage.getItem("cmsUser")
? JSON.parse(sessionStorage.getItem("cmsUser")).tokenId
: ""
},
responseType: "blob"
})
.then(res => {
this.downloadFile(res.data);
})
.catch(res => {
this.downloadFile(res.data);
});
},
// 导出
downloadFile(data) {
let blob = new Blob([data], {type: 'application/zip'})
let url = window.URL.createObjectURL(blob)
const link = document.createElement('a') // 创建a标签
link.href = url
link.download = `导出${utils.getTimeString(new Date())}` // 重命名文件
link.click()
URL.revokeObjectURL(url) // 释放内存
},