美文网首页
vue开发中遇到问题总结(3)

vue开发中遇到问题总结(3)

作者: Simple_Learn | 来源:发表于2020-03-12 10:12 被阅读0次
  1. 使用 papaparse 导出的csv数据,用excel打开中文出现乱码
import Papa from "papaparse";

后台接口返回来的数据

          const resStr = response;
          let fileName = "XXXX文件";
          const data = Papa.parse(resStr);
          // Convert back to CSV
          const csv = Papa.unparse(data);

          //定义文件内容,类型必须为Blob 否则createObjectURL会报错
          let content = new Blob(["\ufeff" + csv], {
            // add "\ufeff"  ES5新增的空白符 【字节次序标记字符】Byte Order Mark,简称BOM
            type:
              ".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
          });
          //生成url对象
          let urlObject = window.URL || window.webkitURL || window;
          let url = urlObject.createObjectURL(content);
          //生成<a></a>DOM元素
          let el = document.createElement("a");
          //链接赋值
          el.href = url;

          if (this.startTime != "" && this.endTime != "") {
            fileName = this.startTime + "-" + this.endTime + fileName;
          }

          el.download = fileName + ".csv";
          //必须点击否则不会下载
          el.click();
          //移除链接释放资源
          urlObject.revokeObjectURL(url);

解释:
主要增加在Blob中添加了 "\ufeff"。 ES5新增的空白符 【字节次序标记字符】Byte Order Mark,简称BOM

相关文章

网友评论

      本文标题:vue开发中遇到问题总结(3)

      本文链接:https://www.haomeiwen.com/subject/eakyjhtx.html