在前端使用Vue 3接受这个接口的数据并下载文件,可以按照以下步骤进行操作:

  1. 在Vue 3项目中创建一个方法来发送请求并接收数据。
import axios from 'axios';

methods: {
  downloadFolder() {
    axios.get('/api/downloadFolder', {
      responseType: 'blob' // 设置响应类型为二进制数据
    })
    .then(response => {
      this.saveFile(response.data);
    })
    .catch(error => {
      console.error(error);
    });
  },
  saveFile(data) {
    const blob = new Blob([data], { type: 'application/octet-stream' });
    const url = URL.createObjectURL(blob);
    const link = document.createElement('a');
    link.href = url;
    link.setAttribute('download', '7月税务信息.zip');
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
  }
}
  1. 在Vue组件中调用downloadFolder方法,例如在模板中添加一个按钮。
<template>
  <button @click="downloadFolder">下载文件</button>
</template>

这样,当按钮被点击时,前端会发送请求到后端接口/api/downloadFolder,后端会生成一个ZIP文件并返回给前端。前端通过saveFile方法将接收到的二进制数据转换为Blob对象并创建下载链接,最后模拟点击链接进行文件下载

前端使用vue3 怎么接受下面接口的数据把文件下载下来? public IActionResult DownloadFolder string path = upload20230208; 指定要打包的文件夹路径 var folderPath = PathCombineAppWebHostEnvironmentWebRootPath path;

原文地址: https://www.cveoy.top/t/topic/imqr 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录