导出下载Excel文件

23 阅读1分钟

v2-809a23dd4cd0de81fcf03baf240827a3_r.jpg

原理

点击一个按钮,向后端请求文件,然后下载

  • 后端返回的是一个blob文件流类型的数据
  • 把它转换成url链接
  • 创建一个a标签
  • 给a标签赋值上链接并加上文件名
  • 隐藏a标签并放到dom里面
  • 让它自己点击

实现

  1. 设置接口响应类型
    • 后端接口返回来的应该是一个文件流(blob)
    • 设置接口响应类型: responseType: 'blob'

2.得到接口响应数据后

// 响应数据: data => 是一个blob数据

// 转成url链接
let url = Window.URL.createObjectURL(new Blob([ data ]))

// 创建a标签
let link = document.createElement('a')
link.style.display = 'none'
link.href = url

// 设置文件名
let fileName = Date.now() + '.xlsx'
link.setAttribute('download', fileName)

// a标签添加到DOM中
document.body.appendChild(link)

// 点击
link.click()