組件內部的js
工具類js
實現效果:
主要js源碼:
methods: {
async downloadPre(){
let res = await Service.downloaded(api.img);
console.log(res.data);
let type = res.data && res.data.type || 'image/jpeg';
if (!res) {
return
}
let url = window.URL.createObjectURL(new Blob([res.data],{type:type}));
let link = document.createElement('a')
link.style.display = 'none'
link.href = url
link.setAttribute('download', 'excel.jpeg')
document.body.appendChild(link)
link.click()
document.body.removeChild(link) // 下載完成移除元素
window.URL.revokeObjectURL(url) // 釋放掉blob對象
},
}
工具類js主要代碼:
export function download(url,data = {}){//文件下載
return new Promise((resolve, reject) => {
axios({
method: "get",
url: url,
data: data,
responseType: "blob"
// responseType: "arraybuffer",
})
.then(response => {
resolve(response)
}).catch(function(err){
reject(err)
})
})
}
功能實現完成,簡單粗暴。