欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

vue 实现post请求文件下载,

程序员文章站 2022-06-15 22:00:40
前端发送post请求,接受后端返回的文件流实现文件下载// 导出submitDownload() { axios({ url: 'url地址', method: 'post', data: this.formInline, responseType: 'blob' // 重点在于配置responseType: 'blob' }).then(res => { const link = document.createElemen...

前端发送post请求,接受后端返回的文件流实现文件下载

// 导出
submitDownload() {
  axios({
      url: 'url地址',
      method: 'post',
      data: this.formInline,
      responseType: 'blob'    // 重点在于配置responseType: 'blob'
  }).then(res => {
      const link = document.createElement('a');  // 创建元素
      let blob = new Blob([res.data], { type: 'application/vnd.ms-excel' });  
      link.style.display = 'none';
      link.href = URL.createObjectURL(blob);   // 创建下载的链接
      //num++
      link.setAttribute('download', '试算平衡表.xlsx');  // 给下载后的文件命名
      document.body.appendChild(link);
      link.click();  // 点击下载
      document.body.removeChild(link);  //  下载完成移除元素
      window.URL.revokeObjectURL(link.href);  // 释放掉blob对象
  })
  .catch(_ => {
  });
}

本文地址:https://blog.csdn.net/weixin_42547971/article/details/110227316

相关标签: vue