0

我正在使用以下内容vue在客户端的项目中下载使用 JavaScript 创建的文件,该项目也使用json2csv.

      // console.log('wtf all 200 rows are here!', modifiedData);

      const csv = json2csvParser.parse(modifiedData);
      let content = 'data:text/csv;charset=utf-8,';
      content += csv;
      const data = encodeURI(content);
      const link = document.createElement('a');
      link.setAttribute('href', data);
      link.setAttribute('download', 'errors_totalcost.csv');
      link.click();

但由于某种原因,该文件只有 29 行而不是全部 200 行。上面的代码在 Firefox 中根本不起作用,但在 chrome 中使用,现在它在 chrome 中被破坏并截断文件。

任何人都可以解释什么是错误的以及如何在客户端创建文件的同时解决它吗?

4

1 回答 1

0

其中一个字段(第 28 行)是一个注释字段,其中包含在浏览器中呈现时如下所示的文本:

Sale Numbers:
#1453
#142356
#78527
#4563232
#45378
#675675
#32452

Or in object like:

{t:"Sale Numbers:↵#1453↵#142356↵#78527↵#4563232↵#45378↵#675675↵#32452"}

我不知道为什么,但是 chrome 在该行之后停止了处理。看起来这是由于,#修复是替换它。您可以使用以下内容进行重现:

const json2csvParser = new Json2csvParser();

const fakeObj = []

for (let index = 0; index < 100; index++) {
  fakeObj.push({
    a:4, b:2, c:1, v:7, t:23, s:10
  })        
};
fakeObj.push({
  a:4, b:2, c:1, v:7, 
  t:"Sale Numbers:↵#1453↵#142356↵#78527↵#4563232↵#45378↵#675675↵#32452", // will cause issue
  // t: "Sale Numbers:↵#1453↵#142356↵#78527↵#4563232↵#45378↵#675675↵#32452".replace(/(#)/gm, " "), // this solution works
  s:10
})
fakeObj.push({
  a:"you wont get this row if the one before has a hash", b:2, c:1, v:7, t:"", s:10
})      

const csv = json2csvParser.parse(fakeObj);
let content = 'data:text/csv;charset=utf-8,';
content += csv;
const data = encodeURI(content);
const link = document.createElement('a');
link.setAttribute('href', data);
link.setAttribute('download', 'errors_totalcost.csv');
link.click();
于 2019-08-28T19:22:00.813 回答