Vue 文件下载教程：使用 axios 和 Blob 对象

在 Vue 中进行文件下载，你可以使用'axios'库来发送网络请求，并使用'Blob'对象来创建文件下载链接。

首先，在 Vue 项目中安装'axios'库：

npm install axios

然后，在 Vue 组件中使用以下代码来进行文件下载：

<template>
  <div>
    <button @click="downloadFile">下载文件</button>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  methods: {
    downloadFile() {
      axios({
        url: 'http://example.com/file.pdf', // 文件的URL地址
        method: 'GET',
        responseType: 'blob' // 响应类型为二进制流
      }).then(response => {
        const url = window.URL.createObjectURL(new Blob([response.data]));
        const link = document.createElement('a');
        link.href = url;
        link.setAttribute('download', 'file.pdf'); // 下载文件的名称
        document.body.appendChild(link);
        link.click();
      });
    }
  }
}
</script>

在上面的代码中，当用户点击“下载文件”按钮时，会发送一个 GET 请求到指定的文件 URL 地址，并将响应的数据保存为二进制流。然后，使用'Blob'对象将二进制流转换为文件对象，并创建一个下载链接。最后，使用'link.click()'方法触发下载链接的点击事件，实现文件下载。

请确保将'http://example.com/file.pdf'替换为实际的文件 URL 地址，并将'file.pdf'替换为要下载的文件的名称。