• 后端根据查询条件生成excel文件返回给前端,vue进行下载


    一、HTML代码

    <el-col :xs="2" :md="2" :sm="3">
        <el-button type="primary" style="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'
      })
    }
  • 相关阅读:
    最简单跳转,待反混爻的合集
    搜索引擎劫持代码
    Warning: Cannot modify header information
    editplus 正则删换行
    在全程Linux環境部署IBM Lotus Domino/Notes 8.5
    3.5-杂项②
    3.4-杂项①
    3.3-ISDN
    3.2-帧中继②
    3.2-帧中继①
  • 原文地址:https://www.cnblogs.com/llcdxh/p/9875250.html
Copyright © 2020-2023  润新知