基于axios进行二进制流下载功能

首先在main.js/ts中引入axios

import axios from 'axios';
Vue.prototype.$axios= axios;

 功能实现：

let formData = new FormData()
formData.set('xx', 'xx') // 下发参数 这里传参具体看后端要求
this.$axios({
  method: 'post',
  url: '后端url路径',
  {responseType: 'blob'} // 请求流类型
}).then(res => {
  if (res.data.size > 0) {
    let blob = new Blob([res.data], { type: res.headers['content-type']})  // 构建bolb 根据后端返回类型构建流
    let url = window.URL.createObjectURL(blob); // 构建流地址
    let link = document.createElement('a'); // 构建下载元素
    let fileName = decodeURIComponent(res.headers['content-disposition'].match(/filename=(.*)/)[1]); // 提取文件名
    link.href = url; // 下载元素url赋值
    link.download = fileName; // 下载后文件名
    document.body.appendChild(link); // 浏览器增加元素
    link.click(); // 点击下载
    link.remove(); // 下载完成移除元素
    window.URL.revokeObjectURL(link.href); // 用完之后使用URL.revokeObjectURL()释放；
  } else {
    this.message.error('下载文件失败 ！')
  }
}).catch(err => {
  this.message.error(err.msg)
})