反应 FilePond FileStatus 枚举

Question

我正在使用 FilePond 库来处理我在 React 应用程序中上传的图片。

我有一个 FilePond 的多重上传实例，一个组件内最多有 10 个文件，该组件将文件上传到一个临时位置，returns 每个文件 onUpload 的临时 ID。

我要解决的问题是我想在所有图片上传完毕之前禁用组件的提交表单按钮。

当我阅读 documentation 时，有一个 FileStatusEnum 有一些关于队列中文件数量的统计数据 PROCESSING_QUEUED 和其他相关信息

我想知道如何访问它以创建基于它的逻辑

下面是 FilePond 实例

<FilePond
  allowMultiple
  maxFiles={maxFiles}
  acceptedFileTypes={["image/*"]}
  imageTransformOutputMimeType="image/png"
  imageTransformOutputQuality={100}
  server={{
    process: handleProcess,
    revert: handleRevert
  }}
  required={required}
  onupdatefiles={fileItems => {
    setFiles(fileItems.map(fileItem => fileItem.file));
  }}
>
  {files.map(file => (
    <File key={file} src={file} origin="local" />
  ))}
</FilePond>

Answer 1

我认为您可以使用 onprocessfiles 回调，它是运行当 FilePond 中的所有文件都已处理时。 https://pqina.nl/filepond/docs/patterns/api/filepond-instance/#callbacks

反应 FilePond FileStatus 枚举

React FilePond FileStatus Enum

reactjs

filepond