vue3下载文件 后端返回文件地址
时间: 2023-11-04 11:06:45 浏览: 80
在Vue3中下载文件后端返回文件地址的方法是通过异步处理下载的数据,并将其转化为Blob对象。然后,创建一个a标签,设置其href属性为Blob对象的URL,设置download属性为文件名,将a标签添加到文档中,模拟用户点击下载,最后移除a标签并释放URL。
以下是示例代码:
```javascript
async downloadHandle(data) {
const result = await downloadBootLogo({ id: data });
const blob = new Blob([result], { type: result.type });
const downloadElement = document.createElement("a");
const href = window.URL.createObjectURL(blob);
downloadElement.href = href;
const filename = new Date().getTime();
downloadElement.download = filename;
document.body.appendChild(downloadElement);
downloadElement.click();
document.body.removeChild(downloadElement);
window.URL.revokeObjectURL(href);
}
```
关于中文乱码问题,你可以在创建Blob对象时,添加"\uFEFF"(BOM头)到数据前,同时指定正确的文件类型和字符集,如下所示:
```javascript
const blob = new Blob(["\uFEFF", result], { type: "data:text/csv; charset=utf-8" });
```