上传React后正在删除FilePond文件

Question

好吧，我已经无计可施了。我在使用Hooks的功能组件中使用带有React的FilePond。我没有使用FilePond来处理实际的上传，只是用文件设置状态，我的简化版本是：

文件池：

<FilePond          
onupdatefiles={fileItems => handleFilepondUpdate(fileItems)}            
/>
</Form.Field>

句柄更新：

const handleFilepondUpdate = fileItems => {
if (fileItems.length === 0) {
addAttachment({
...picture,
bugAttachment: null
});
} else {
addAttachment({
...picture,
bugAttachment: fileItems[0].file
});   
}
};

状态：

const [picture, addAttachment] = useState({
bugAttachment: ""
});
const { bugAttachment } = picture;

最后我上传并清除输入状态：

const onSubmit = e => {
e.preventDefault();
const fd = new FormData();
fd.append("email", props.user[0].email);
fd.append("bugDescription", bugDescription);
fd.append("bugAttachment", bugAttachment);
addBug(fd).then(() => {
setBug({
bugDescription: ""
});
});
};

那么，在表单发送完成后，我该如何删除FilePond文件呢？

Answer 1

尝试使用addAttachment hook 清除onSubmit内的bugAttachment属性

const onSubmit = e => {
e.preventDefault();
const fd = new FormData();
fd.append("email", props.user[0].email);
fd.append("bugDescription", bugDescription);
fd.append("bugAttachment", bugAttachment);
addBug(fd).then(() => {
setBug({
bugDescription: ""
});
addAttachment({
...picture,
bugAttachment:""
});  
});
};

更新：您似乎没有在图片状态中使用文件道具，请尝试这样的操作。

<FilePond          
files={bugAttachment}
onupdatefiles={fileItems => handleFilepondUpdate(fileItems)}            
/>