使用React DropZone将CSV转换为JSON客户端

本文介绍了使用React DropZone将CSV转换为JSON客户端的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

这可能吗?

从反应放置区，我收到了一个File对象，该对象的File.preview属性值为blob:url.即File {preview: "blob:localhost:8080/52b6bad4-58f4-4ths-a2f5-4ee258ba864a"

From React dropzone, i receive a File object with a File.preview property whose value is a blob:url. i.e. File {preview: "blob:localhost:8080/52b6bad4-58f4-4ths-a2f5-4ee258ba864a"

是否可以在客户端上将其转换为json?该文件不需要存储在数据库中(将转换为JSON).我尝试使用 csvtojson ，但由于使用节点供电，因此无法使用文件系统它.理想情况下，一旦用户上载，便希望在客户端中进行转换.任何建议欢迎.

Is there a way to convert this to json on the client? The file isnt need to be stored in a database (the convert JSON will be). I've attempted to use csvtojson but it's unable to use the file system as it uses node to power it. Ideally would like to convert this in the client if possible, once user has uploaded it. Any suggestions welcomed.

<Dropzone name={field.name} onDrop={(acceptedFiles, rejectedFiles) => { acceptedFiles.forEach(file => { console.log(file) let tempFile = file.preview csv() .fromSteam(tempFile) // this errors with fs.exists not a function as its not running serverside .on('end_parsed',(jsonArrObj)=>{ console.log(jsonArrObj) }) }) }} >

推荐答案

是的，它可能在FileReader和csv中使用:

Yes, its possible with FileReader and csv:

import csv from 'csv'; // ... const onDrop = onDrop = (e) => { const reader = new FileReader(); reader.onload = () => { csv.parse(reader.result, (err, data) => { console.log(data); }); }; reader.readAsBinaryString(e[0]); } // ... <Dropzone name={field.name} onDrop={onDrop} />

FileReader API: developer.mozilla/en/docs /Web/API/FileReader csv软件包: www.npmjs/package/csv

FileReader API: developer.mozilla/en/docs/Web/API/FileReader csv package: www.npmjs/package/csv