Filepond - 有预加载图像时不会触发 onprocessfiles 回调

编程问答 2022-04-24

问题描述

根据 Filepond 文档，“onprocessfiles”回调应该在列表中的所有文件都被处理后触发，当我没有任何预加载文件时这工作正常，但当我有它时不起作用。

我使用 react-hook-form 来处理 filepond 状态，这里是我设置预加载文件的地方：

useEffect(() => {
 reset({
   ...response,sku: response.sku,imagenes: response.imagenes[0].imagen // filepond files array
   ? response.imagenes.map(img => ({
     source: `${response.proveedorId}/${img.imagen}`,options: {
       type: 'local',Metadata: {
         id: img.imagenId,poster: `${server}/${response.proveedorId}/${img.imagen}`,},}))
    : [],// if doesn't come any value assigns an empty array
   })
},[...dependencies])

这是我的 Filepont 组件：

      <FilePond
        files={filesArray}
        allowMultiple={true}
        allowReorder={true}
        allowProcess={true}
        maxFiles={maxFiles}
        labelIdle={`Arrastra aquí tus imágenes,<span class="filepond--label-action">Elegir imágenes...</span>.`}
        className="FilePondCustom"
        onaddfilestart={() => console.log('addFileStart')}
        onprocessfiles={() => console.log('all files has been processed')}
        server={{
          url: `${server}/upload/`,load: (source,load,error) => {
            if (source) {
              fetch(source,{
                mode: 'no-cors',})
                .then(res => {
                  return res.blob()
                })
                .then(blob => {
                  return load(blob)
                })
                .catch(error)
            }
          },}}
        maxParallelUploads={maxFiles}
        onupdatefiles={fileItems => setValue(name,fileItems)}
      />

预期的结果是，即使我已经预加载了文件，“onprocessfiles”回调也会触发。

文件池：4.28.2

反应文件池：7.1.1

反应：17.0.1

react-hook-form：7.1.0

FilepondDocs/properties/callbacks

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

filepondreactjsreactjsreactjsreactjs