利用原生fetch下载文件,该方法完美解决了浏览器下载文件会打开文件(本身是下载,结果却打开文件变成了预览文件)的问题。
tips:
1.在a标签上加download属性有时会不管用
2.直接使用blob API将url转换为blob地址,API会直接将url认为是字符串,所以下载文件后打开文件显示文件已损坏
3.推荐将该方法放入mixin中,需要使用的组件可引入
//url:文件地址
//fileName 文件名
download(url,fileName){
// 利用原生fetch直接下载文件
fetch(url).then(res => res.blob()).then(blob => {
let eleLink = document.createElement("a");
eleLink.style.display = "none";
eleLink.target = "_blank";
eleLink.setAttribute('download',fileName);
eleLink.href = URL.createObjectURL(blob);
document.body.appendChild(eleLink);
eleLink.click();
URL.revokeObjectURL(eleLink.href);
document.body.removeChild(eleLink);
})
}