关于javascript:前端导出excel文件兼容IEChrome

导出文件，应用最多的形式还是服务器端来解决,然而有时候须要web端来导出一个表格
思路

1.导出文件的格局data:text/csv;charset=utf-8,IE上加上BOM头\ufeff 避免乱码
2.表格数据以","分列, \n分行
3.应用encodeURI转换成能够辨认的url,IE上加上decodeURIComponent转换这个url

话不多说间接上代码

//导出csv文件
export const exportExcel = data => {
  var csvContent = "data:text/csv;charset=utf-8,";
  if (window.navigator.msSaveOrOpenBlob) {
    // 加上 \ufeff BOM 头,避免乱码
    csvContent = "\ufeff";
  }
  //csv 文件能够用Excel关上， 如果是导出一个table 的话，应用Excel 就不便很多了
  data.forEach(function(infoArray, index) {
    var dataString = infoArray.join(",");
    //分列应用 ， 号宰割， 分行用 \n
    csvContent += index < data.length ? dataString + "\n" : dataString;
  });
  exportFun(csvContent);
};
const exportFun = csvContent => {
  if (window.navigator.msSaveOrOpenBlob) {
    // IE 浏览器  \n.应用后会发现列能够离开，然而不换行。 看上去不意识 应用decodeURIComponent 进行编码
    var blob = new window.Blob([decodeURIComponent(encodeURI(csvContent))], {
      type: "text/csv;charset=utf-8;"
    });
    //Internet Explorer 10 的 msSaveBlob 和 msSaveOrOpenBlob 办法容许用户在客户端上保留文件,名字轻易起
    navigator.msSaveBlob(blob, "download.csv");
  } else {
    //非IE浏览器间接应用a标签download下载
    var encodedUri = encodeURI(csvContent);
    var link = document.createElement("a");
    link.setAttribute("href", encodedUri);
    link.setAttribute("download", "download.csv");
    document.body.appendChild(link);
    link.click();
  }
};
 //造数据
 exportExcel() {
     //表头
     let theadData = [["抓拍图片", "工夫", "设施名称"]],
     //表格内容,列数必须和表偷数据统一
     for (var v of this.snpaShotData_notype) {
       const img =v.SubImageList[0].StoragePath
       const time = v.FaceAppearTime ||  "";
       const name = v.ApeName || "";
       var arr = [img, time, name];
       theadData.push(arr);
     }
     //最终的数据应该是二维数组,数组中每个元素代表每一行
     exportExcel(theadData);
   },