javascript - React Filepond加载初始图像不起作用

我在使用Filepond for React时遇到了一些麻烦。当前，我想在加载页面时预加载用户的个人资料图片。我尝试了两种不同的方法，但都没有成功：

首先，我尝试使用Filepond的服务器加载选项，如下所示：

<FilePond
   ref={pond}
   ... other props here
   files={[
   {
     source: this.props.user.id,
     options: {
     type: 'local'
   }
   }
   ]}
   server={{
   load: (userId, load) => {
   fetch(fetchDomain + "/profiles/" + userId)
     .then(res => res.blob())
     .then(blob => {
        console.log('blob is: ', blob)
        return load
     })
   }
   }}
/>

I fetch from my express backend which is running on the same domain and returns an s3 image URL. This leads to an infinite loading situation and a picture is never loaded. I kept making small changes to this trying to fix it, but was never able to get it to work. At some point when I was messing with the code it would finish loading, but the image would be gray/unavailable with no error messages.

我采取的另一种方法是将“文件”设置为图像URL，但这也不起作用。同样的结果，一个灰色的图像，我可以通过单击“删除项目”按钮将其清除。但是，我确实注意到，如果该URL是base64 url​​，它将实际上正确加载图像。

我已经调试了几个小时。我在这里缺少什么吗？

我不确定是否相关，但是文件顶部的设置如下：

import 'filepond/dist/filepond.min.css';
import CropperEditor from './Cropper';
import FilePondPluginFileValidateType from "filepond-plugin-file-validate-type";
import FilePondPluginImageExifOrientation from "filepond-plugin-image-exif-orientation";
import FilePondPluginImagePreview from "filepond-plugin-image-preview";
import FilePondPluginImageCrop from "filepond-plugin-image-crop";
import FilePondPluginImageResize from "filepond-plugin-image-resize";
import FilePondPluginImageTransform from "filepond-plugin-image-transform";
import FilePondPluginImageEdit from "filepond-plugin-image-edit";
import 'filepond-plugin-image-preview/dist/filepond-plugin-image-preview.css';
const fetchDomain = process.env.NODE_ENV === 'production' ? process.env.REACT_APP_FETCH_DOMAIN_PROD : process.env.REACT_APP_FETCH_DOMAIN_DEV;

// Register the plugins for filepond
registerPlugin(
  FilePondPluginFileValidateType,
  FilePondPluginImageExifOrientation,
  FilePondPluginImagePreview,
  FilePondPluginImageCrop,
  FilePondPluginImageResize,
  FilePondPluginImageTransform,
  FilePondPluginImageEdit,
);

const pond = React.createRef();

这是我除去FilePondPluginImagePreview以外的所有插件并使用第一种方法后，加载时组件外观的图片：

它说未定义...

在进一步阅读文档之后，我现在对于应该加载还是获取感到困惑。