后端根據查詢條件生成excel文件返回給前端,vue進行下載


一、HTML代碼

<el-col :xs="2" :md="2" :sm="3">
    <el-button type="primary" style="width:100%;" @click.stop="handleDownloadExecl">導 出</el-button>
</el-col>

二、JS代碼

// 根據查詢條件下載excel
handleDownloadExecl () {
  downloadDisabilityListExcelApi(this.searchForm).then(info => {
    if (!info) {
      return
    }
    let url = window.URL.createObjectURL(info)
    let link = document.createElement('a')
    link.style.display = 'none'
    link.href = url
    link.setAttribute('id', 'downloadLink')
    link.setAttribute('download', '殘疾人信息表.xls')
    document.body.appendChild(link)
    link.click()
    // 刪除添加的a鏈接
    let objLink = document.getElementById('downloadLink')
    document.body.removeChild(objLink)
    // 釋放內存
    window.URL.revokeOjbectURL(url)
  })
}

三、axios的設置

export function downloadDisabilityListExcelApi (data) {
  return service({
    url: `/excel/excelDownloads`,
    method: 'GET',
    params: data,
    responseType: 'blob'
  })
}

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM