VuePost請求下載下傳檔案

Vue下載下傳檔案

• • Post請求下載下傳

Post請求下載下傳

1. request.js

export function exportExcel(params) {
  return request({
    url: '/report/access/exportExcel',
    method: 'post',
    responseType: 'blob',
    data: params
  })
}
           

exportExcel(this.queryObject).then(res => {
        const link = document.createElement('a') // 建立元素
        const blob = new Blob([res], { type: 'application/vnd.ms-excel' })
        link.style.display = 'none'
        link.href = URL.createObjectURL(blob) // 建立下載下傳的連結
        link.setAttribute('download', 'xx.xlsx') // 給下載下傳後的檔案命名
        document.body.appendChild(link)
        link.click() // 點選下載下傳
        document.body.removeChild(link) //  下載下傳完成移除元素
        window.URL.revokeObjectURL(link.href) // 釋放掉blob對象
      })
           

注意: res 是後端傳回的流