vue下载文件保存到本地
时间: 2023-08-07 17:09:08 浏览: 78
你可以使用 Vue.js 的 axios 库来下载文件并保存到本地。下面是一个简单的例子:
```javascript
// 引入 axios 库
import axios from 'axios';
// 定义一个方法来下载文件
function downloadFile(url, filename) {
axios({
url: url,
method: 'GET',
responseType: 'blob' // 设置响应类型为 blob
}).then((response) => {
const url = window.URL.createObjectURL(new Blob([response.data]));
const link = document.createElement('a');
link.href = url;
link.setAttribute('download', filename);
document.body.appendChild(link);
link.click();
});
}
// 调用下载方法
downloadFile('http://example.com/file.pdf', 'file.pdf');
```
在上面的例子中,`downloadFile` 方法接受两个参数:文件的 URL 和要保存的文件名。它使用 axios 发起一个 GET 请求,并将响应类型设置为 `blob`。然后,它创建一个临时的 URL 对象,将其赋值给一个新创建的 `<a>` 标签的 `href` 属性,并设置 `download` 属性为指定的文件名。最后,将这个 `<a>` 标签添加到文档中,并模拟点击这个链接来下载文件。
请确保将实际的文件 URL 和文件名传递给 `downloadFile` 方法调用。