Estoy tratando de enviar datos desde un archivo CSV en POST a una API.

Sin embargo, tengo un problema. No puedo mostrar mi página, en su lugar aparece este error:

TypeError: los niños no son una función

 62 | }; 63 | }, [open]); // TODO: Figure out why react-styleguidist cannot create docs if we don't return a jsx element 64 | > 65 | return /*#__PURE__*/React.createElement(Fragment, null, children(_objectSpread(_objectSpread({}, props), {}, { 66 | open: open 67 | }))); 68 | });

Puedes ver mi código a continuación:

 import React, { Component } from 'react'; import Dropzone from 'react-dropzone'; import csv from 'csv'; class App extends Component { onDrop(files) { this.setState({ files }); let file = files[0]; const reader = new FileReader(); reader.onload = () => { csv.parse(reader.result, (err, data) => { let userLists; userLists = []; for (let i = 0; i < data.length; i++) { const name = data[i][0]; const phoneNumber = data[i][1]; const address = data[i][2]; const classType = data[i][3]; const newUser = { "name": name, "phoneNumber": phoneNumber, "address": address, "class": classType }; userLists.push(newUser); fetch('https://localhost:8080/api/users', { method: 'POST', headers: { 'Accept': 'application/json', 'Content-Type': 'application/json', }, body: JSON.stringify(newUser) }).then(r => r.result) } }); }; reader.readAsBinaryString(file); } render() { const fontSize = 5; return ( <div align="center" oncontextmenu="return false"> <br /><br /><br /> <div className="dropzone"> <Dropzone accept=".csv" onDropAccepted={this.onDrop.bind(this)}> <div> <p>Drop some files here</p> </div> </Dropzone> <br /><br /><br /> </div> <h2>Upload or drop your <font size={fontSize} color="#00A4FF">CSV</font><br /> file here.</h2> </div> ) } } export default App;

Si tienes alguna idea, me interesa. Nunca he usado Dropzone, así que no es muy complicado.