vue中导出Excel文件流

Posted 2020-12-16 wenshaochang123

1、封装导出的方法

export function httpExport (url, params) {
  return new Promise((resolve, reject) => {
    axios({
      url: url,
      method: ‘post‘,
      data: params,
      responseType: ‘blob‘
    })
      .then(res => {
        debugger
        resolve(res)
      })
      .catch(err => {
        if (err === undefined || err.__CANCEL__) {
          return
        }
        notification.error({
          title: ‘错误‘,
          message: err
        })
        reject(err)
      })
  })
}

　2、处理respones数据

if (res) {
          const fileName = ‘未绑定IC卡列表.xlsx‘
          const content = res.data
          const blob = new Blob([content])
          if (‘download‘ in document.createElement(‘a‘)) { // 非IE下载
            const elink = document.createElement(‘a‘)
            elink.download = fileName
            elink.style.display = ‘none‘
            elink.href = URL.createObjectURL(blob)
            document.body.appendChild(elink)
            elink.click()
            URL.revokeObjectURL(elink.href) // 释放URL 对象
            document.body.removeChild(elink)
          } else { // IE10+下载
            navigator.msSaveBlob(blob, fileName)
          }
        }

　3、在axios拦截器中处理响应体（普通的响应体是response.data）

if (
      response.headers[‘content-type‘] ===
      ‘application/vnd.ms-excel;charset=UTF-8‘
    ) {
      // 是否为导出
      return Promise.resolve(response)
    }