使用 react-dropzone 分块上传答案

【问题标题】：Chunked uploads with react-dropzone使用 react-dropzone 分块上传
【发布时间】：2019-12-20 23:44:13
【问题描述】：

我想使用 React-Dropzone 上传分块文件。我有以下代码：

OnDrop：

const dropTest = async (file, rejectedFiles) => {
    var formData = new FormData();
    formData.append('file', file);
    try {
      const response = await fetch(appContext.api_url + 'ApiUser/fileUpload', {
        method: 'POST',
        body: formData
      })
      const result = await response.json();
    } catch (error) {
      console.error('Error:', error);
    }
}

渲染：

<Dropzone onDrop={dropTest} chunking={true}>
  {({getRootProps, getInputProps}) => (
      <section>
         <div {...getRootProps()}>
            <input {...getInputProps()} />
            <p>Drag 'n' drop some files here, or click to select files</p>
          </div>
      </section>
  )}
</Dropzone>

Dropzone 库有一个 api，名称为 {chunking: true}，但它不适用于 react-dropzone，我该如何归档？

如果 React-Dropzone 无法实现，我可以得到关于另一个用于 react 的分块上传解决方案的建议。

【问题讨论】：

你找到解决办法了吗？
可以推荐github.com/rpldy/react-uploady - 有点因为我写了它，但也因为它处理了这个用例等等:)

标签： reactjs dropzone react-dropzone

【解决方案1】：

据我所知，react-dropzone 不支持分块。这些功能在 fineuploader 库中可用（REACT 支持它，这里是 link）。它使您能够构建 DropZone、ProgressBar、Chunking、Retry 等等。它也有据可查。

【讨论】：