vue 导出 excal

之前用axios 发请求携带参数来下载 老是显示乱码问题  设置响应格式为 blob 也不能解决问题 

然后用单独的 xhr 来发请求下载解决了问题

Vue.prototype.downLoadXls = function (url,fileName, dataParams) {//传入的 url地址  ，文件名 ，传入参数为对象格式

  let oReq = new XMLHttpRequest(); 

  let dataStr = '' //数据拼接字符串

  Object.keys(dataParams).forEach(key => { //对传入参数做拼接字符串处理

    let str = String(dataParams[key])

    dataStr += key + '=' + str + '&'

    // dataStr += key + '=' + dataParams[key] + '&'

  })

  if (dataStr !== '') {

    dataStr = dataStr.substring(0, dataStr.lastIndexOf('&'))

    url = url + '?' + dataStr

  }

  var exportDeviceUrl = encodeURI(url);

  oReq.open("get", exportDeviceUrl, true);

  oReq.setRequestHeader("Content-Type", "application/json;charset=UTF-8");//设置类型格式

  console.log(window.sessionStorage.getItem('token'))

  oReq.setRequestHeader('token', window.sessionStorage.getItem('token') || null); //这是需要携带的token 请求不需要的可以去掉

  var data = JSON.stringify(dataParams);

  oReq.responseType = "blob";

  oReq.onreadystatechange = function() {//成功的回调

    if (oReq.readyState == 4 && oReq.status == 200) {

      var content = oReq.response;

      if(content['type'] === 'application/vnd.ms-excel'){//判断返回数据类型

        var blob = new Blob([content]);

        var elink = document.createElement("a");//创建a标签

        elink.download = fileName + new Date().getFullYear()+""+(new Date().getMonth()+1)+""+new Date().getDate()+""+new Date().getHours()+""+new Date().getMinutes()+""+new Date().getSeconds()+ ".xls"//给下载文件加上时间戳

        elink.href = URL.createObjectURL(blob);//下载地址

        elink.click(); 

      

    } 

  };

}

oReq.send();

}