Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

473
Visualizações
Dropzone : TypeError: children is not a function

I am trying to send data from a CSV file in POST to an API.

However, I have a problem. I can't display my page, instead I get this error :

TypeError: children is not a function

  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 | });

You can see my code below :

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;

If you have any ideas, I'm interested. I've never used Dropzone, so it's not very complicated.

about 4 years ago · Juan Pablo Isaza
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda