我正在使用 react-filepond 为我正在开发的应用程序中的上传组件提供动力，但遇到了一个问题，即在第一次正常进行之后，只有所有其他文件上传。第一个文件上传得很好，触发了所有预期的事件侦听器和服务器端代码。单击或将第二个文件拖入池中似乎不会在 UI 中执行任何操作——文件对话框或拖入的文件消失，没有上传尝试的迹象。但是，请求的文件将在第三次尝试时正确上传。此序列重复，第四个请求失败，但第五个成功，依此类推，依此类推...
行为可以在这个代码沙箱中看到：https://codesandbox.io/s/hungry-elion-l627c
与“普通”文件池用例相比，我的实现在两个方面是非标准的：
首先，因为后端软件要求所有输入文件都在服务器上的同一目录中，所以我不得不在父组件中存储一个 serverId 状态变量并将其作为道具传递给 filepond。为了防止在触发 removfile 事件时删除整个文件夹，我必须添加一个 removefile 侦听器，该侦听器将触发包含 serverid 和文件名的删除请求。这一切正常。
第二，由于文件输入预计会非常大，我需要禁用文件池所在表单上的提交按钮，以防止在所有上传完成之前过早提交。这是通过为 initfile 和 processfile 事件添加侦听器来实现的，我仅使用它们来切换表单组件中的“filesLoaded”状态，进而控制是否启用提交按钮。这就是问题开始的地方。
第一个问题是添加此行为会导致上传失败，这显然是表单组件重新呈现的结果。为了解决这个问题，我防止使用 shouldComponentUpdate 规则重新渲染表单组件，该规则监视 files 数组的长度和 filesLoaded 状态的值。这允许文件正常上传，但触发了当前的故障行为。
通过观察控制台和服务器请求，我可以看到失败的文件上传最初被添加到父组件状态的 files 数组中，正如他们应该的那样，但立即下降并触发 removefile 侦听器，这 (正确）调用api方法删除服务器端的（不存在的）文件。
我也可以合理肯定地说，这个问题在某种程度上与表单组件的重新渲染有关，因为如果表单组件中包含一个空的 shouldComponentUpdate 块，filepond 会正常运行，从而有效地阻止了父表单组件的任何重新渲染。虽然这可以说是“修复了故障”，但出于显而易见的原因，这不是一个可行的解决方案。
即使查看了 filepond 代码，我也不明白为什么会发生这种情况，我希望有人能对此有所了解。
感谢任何帮助！