Javascript React-dropzone:useState，在onDropAccepted内异步

目前我正在使用react dropzone

在最上面，我有一些东西可以跟踪用户放入dropzone的文件数量

[files, setFiles] = useState([]);

后来我有了这些：

const checkBucketLimitSingle = files => {
  if (files.length >= FILE_BUCKET_LIMIT) {
    return false;
  } else {
    return true;
  }
};

const onDropAccepted = useCallback(
  acceptedFiles => {
    // async
    const processAcceptFiles = async () => {
      let singleFile;

      singleFile = acceptedFiles[0];

      if (acceptedFiles.length > 1) {
        setIsMaxFileNum(true);
        return;
      } else {
        // e.g. api upload error
        if (isUploadError) {
          // NOTE: upload error, we empty file buckets
          // But "files" as dependency passed into useCallback, but not reflected after setFiles([])
          setFiles([]);
        }

        // check bucket limit
        const isValidBucketLimit = checkBucketLimitSingle(files);

        if (isValidBucketLimit) {
          // all good, can set
          setFiles([...files, singleFile]);
        } else {
          // go to ui
          return;
        }
      }
    };

    // fire
    processAcceptFiles();
  },
  [
    // set by useState
    files
  ]
);

const { getRootProps, getInputProps } = useDropzone({
  onDropAccepted,
  onDropRejected
});

我的用例是，在用户将文件放入react dropzone后，他将单击upload按钮。 说上传过程有问题<将设置代码>isUploadError

我想使用

setFiles（[]）

清理文件状态，但是

const isValidBucketLimit=checkBucketLimitingle（files）

中的

文件

不会在

setFiles（[]）之后立即反映出来

我的问题是，在
setFiles（[]）
之后，这是一种将文件（状态）设置回
[]
的方法吗？如果仍然不清楚，我将尝试进一步解释。
setFiles
是一个异步操作，它肯定不会以过程的方式立即更改

const onDropAccepted = useCallback(
  acceptedFiles => {
    // async
    const processAcceptFiles = async () => {
      let singleFile;

      singleFile = acceptedFiles[0];

      if (acceptedFiles.length > 1) {
        setIsMaxFileNum(true);
        return;
      } else {
        let updatedFiles = [...files];
        // e.g. api upload error
        if (isUploadError) {
          // NOTE: upload error, we empty file buckets
          // But "files" as dependency passed into useCallback, but not reflected after setFiles([])
          updatedFiles = [];
        }

        // check bucket limit
        const isValidBucketLimit = checkBucketLimitSingle(updatedFiles);

        return isValidBucketLimit
          ? setFiles([...updatedFiles, singleFile]);
          : setFiles([])
      }
    };

    // fire
    processAcceptFiles();
  },
  [
    // set by useState
    files
  ]
);

const { getRootProps, getInputProps } = useDropzone({
  onDropAccepted,
  onDropRejected
});

试试这个，也许不是你想要的，因为所有的东西我都不清楚你如何使用它，你想做什么，但至少，它可以帮助理解这个想法
 我想在setFiles中进行回调，setFiles（[]，（files）=>{checkBucketLimitingle（files）}）；与此类似，但在异步内使用useEffect时出现语法错误