kendo-react-ui - KendoReact 上传 - 保存文件后将文件 ID 传递给 React

Question

我对剑道反应上传控制有点坚持。

我需要自定义 kendo react 上传控件的渲染。用户上传文件后，我想将文件保存在数据库中。然后我需要将数据库 ID 传递回客户端，因为如果用户想要删除文件，我还需要清除数据库。

为了给你一个想法，这是我想要实现的。

https://stackblitz.com/edit/react-ghna5h

（当你启动 stackblitz 打开文件 app/main.jsx）

可能吗？谢谢你的帮助

Answer 1

我结合使用 onStatusChange 和 onBeforeRemove 事件解决了这个特定问题。服务器的“保存”端点返回一个 id (responseUID)，可以通过 onChange 事件的响应对象进行访问。我在“文件”对象上设置了这个 ID。然后，当您删除文件时，我将 responseUID 传递到附加数据字段中，该字段被放入 POST 正文中。

    const onStatusChange = (e) => {
        if (e.response) {
            const fileId = e.response.response.responseUID;
            // This does not deal with multiple or batch uploads.
            e.affectedFiles[0].responseUID = fileId;
        }
    };

    const onBeforeRemove = (e) => {
        e.additionalData.responseUID = e.files[0].responseUID;
    };

    return (
        <Upload
            batch={false}
            defaultFiles={[]}
            withCredentials={false}
            saveUrl="https://localhost/upload/save"
            removeUrl="https://localhost/upload/remove"
            onStatusChange={onStatusChange}
            onBeforeRemove={onBeforeRemove}
        />
    );