关于导出、下载excel

方法一：
1、接口部分的封装

/**
 * 请求头参数规则 token + client + version + language + timezone
 * @returns {string}
 */
function getAuthenticator() {
    
    
  return `${
      
      ccutils.getToken()} ${
      
      requestHeaderParams.CLIENT_FLAG} ${
      
      
    requestHeaderParams.version
  } ${
      
      ccutils.getHeaderLanguage()} ${
      
      requestHeaderParams.TIMEZONE_FLAG}`;
}

/**
 * 导出
 * @param url
 * @param params
 */
export const getuploadFile = async function(url, params) {
    
    
  let res = await axios.get(url, {
    
    
    params,
    headers: {
    
    
      authenticator: getAuthenticator(),
    },
    responseType: 'blob',
  });
  return res;
};

2、标签

<Button @click="exportTemplate">下载模板</Button>
//当点击模板调用接口后，底部出现导出的内容部分
<a href ref="exportA" style="display:none;"></a>

  /**
   * 下载模板
   */
  async exportTemplate(){
    
    
    try{
    
    
      let res = await apis.exportUpperLimitExcelTemplateByUser();  //调用导出模板的接口

      let blob = res.data;
      console.log("nowres",res)
      this.$refs.exportA.href = window.URL.createObjectURL(blob);  //通过URL.createObjectURL(blob)可以获取当前文件的一个内存URL
      this.$refs.exportA.download = "客流上限模板.xls"
      this.$refs.exportA.click();
    }catch(e){
    
    }
  },

或者另外一个写法，不写a标签在函数中利用js的写法实现，浏览器下方出现导出的excel

let objectUrl = window.URL.createObjectURL(blob)
let a = document.createElement("a");
a.setAttribute("style","display:none");
a.setAttribute("href",objectUrl);
a.setAttribute("download","客流上限模板.xls");
a.click();
URL.revokeObjectURL(objectUrl)

导出接口exportUpperLimitExcelTemplateByUser，返回信息内容为

补充：

a标签的属性：

download：规定被下载的超链接目标。    

href：规定链接指向的页面的 URL。    

hreflang：规定被链接文档的语言。    

media：规定被链接文档是为何种媒介/设备优化的。    

rel：规定当前文档与被链接文档之间的关系。       

target：规定在何处打开链接文档。    

 

type：规定被链接文档的的 MIME 类型。   

target属性

_blank 新窗口打开链接

_self 当前页打开链接

方法二：
将excel放入oss服务器上，前端拿到相关链接，采用window.open

     <a class="martop-content" style="display:block" @click="templateDownload">下载excel模板</a>
     import {
    
    POS_SEARCH_TEMPLATE} from "config/data";
     /**
     * 下载模板
     */
    templateDownload() {
    
    
      window.open(POS_SEARCH_TEMPLATE);
    },

在data.js中

let httpType = 'http';
if (window.location.href.substr(0, 5) == "https") {
    
    
  httpType = 'https';
}
export const POS_SEARCH_TEMPLATE= httpType + "://oss-cn-h-import-template.xls";