javascript - Dropzone : TypeError: children 不是函数

Question

我正在尝试将 POST 中的 CSV 文件中的数据发送到 API。

但是，我有一个问题。我无法显示我的页面，而是收到此错误：

TypeError：children 不是函数

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

你可以在下面看到我的代码：

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;

如果你有什么想法，我很感兴趣。我从未使用过 Dropzone，所以它不是很复杂。

标签： javascriptreactjs