读取ReactJ中具有相对路径的局部CSV

Question

使用 reactjs（在流星中）我想读取带有相对路径的本地csv文件，并在其行上循环：

import Papa from 'papaparse';
var csvfile = "../../../data.csv";
Papa.parse(csvfile, {
  step: function (row) {
    console.log("Row:", row.data);
  },
});

这返回

row：[[['../../../../data.csv']]

Answer 1

使用文件而不是字符串作为输入时，您可以设置download配置标志。从配置文档：

如果为true，这表明您传递的字符串作为第一个对parse（）的论点实际上是可以下载文件的URL并解析其内容。

import csvFile from '../../data/my-csv-file.csv'
Papa.parse(csvFile, {
    download: true,
    complete: function (input) {
         const records = input.data;
    }
});

Answer 2

西蒙·拉斯（Simon Raes）的回答最有帮助。这是一个完整的反应示例：

import React from 'react';
import { readString } from 'react-papaparse';
import siteListCSV from './example.csv';
const papaConfig = {
  complete: (results, file) => {
    console.log('Parsing complete:', results, file);
  },
  download: true,
  error: (error, file) => {
    console.log('Error while parsing:', error, file);
  },
};
readString(siteListCSV, papaConfig);
function App() {
  return (
    <h1>Check the console</h1>
  );
}
export default App;

Answer 3

看起来您的库期望JSON，而您指定了一条路径。

您应该使用FS从文件中读取JSON，然后将其传递给解析方法。

fs.readFile(csvFile, 'utf8', function (err, data) {
    if (err) {
        throw err;
    }
    Papa.parse(data, {
     step: function (row) {
      console.log("Row:", row.data);
     }
   });
});