Question

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

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

返回

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

Answer 1

使用文件而不是字符串作为输入时，可以设置download配置标志。来自config documentation：

如果为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

看起来您的库需要JSON，而您指定了路径。

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

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

Answer 3

Simon Raes 的回答帮助最大。这是一个完整的 React 示例：

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;

在ReactJS中读取具有相对路径的本地CSV

3 个答案: