将记录中的多个字段保存在 react-admin 表单中的不同集合中答案

【问题标题】：Save multiple fields from record in different collection in react-admin Form将记录中的多个字段保存在 react-admin 表单中的不同集合中
【发布时间】：2022-09-27 19:31:28
【问题描述】：

我正在使用react-admin 来管理 MongoDB 数据库。数据库中集合的简化示例：

contacts = [
    { id: 8, name: \"Joe\", country: \"UK\" },
]

tasks = [
    { id: 0, description: \"\", dev: { contact_id: 8, name: \"Joe\" } },
]

tasks 中的文档必须同时存储contact_id（联系文档参考）和name（显示在许多不同的视图中，因此可以减少 API 调用的数量）。在这种情况下，我会在ReferenceInput 中使用AutocompleteInput 来保存contact_id。

<ReferenceInput source=\"dev.contact_id\" reference=\"contacts\">
    <AutocompleteInput
        source=\"dev.contact_id\"
        optionText=\"name\"
        optionValue=\"id\"
    />
</ReferenceInput>

但是，一旦在Autocomplete 中选择了联系人，我就找不到保存字段name 的方法，因此task 文档看起来像示例中的那样。到目前为止，我尝试在提交表单之前获取contact 记录并添加name 字段，但它不起作用（只能在函数组件的主体内调用挂钩）：

export const TaskForm = ({ children }) => {
    const { handleSubmit } = useForm()

    const onSubmit = async (data) => {
        const contact = await useGetOne(\'contacts\', { id: data?.dev?.contact_id })
        console.log(contact)
    }
    return (
        <Form onSubmit={handleSubmit(onSubmit)}>
            {children}
        </Form>
    )
}

有什么建议么？

标签： react-admin

【解决方案1】：

也许您可以使用 dataProvider-hook 代替 useGetOne：

export const TaskForm = ({ children }) => {
    const { handleSubmit } = useForm()
    const dataProvider = useDataProvider();

    const onSubmit = async (data) => {
        const contact = await dataProvider.getOne('contacts', { id: data?.dev?.contact_id });
        console.log(contact)
    }
    return (
        <Form onSubmit={handleSubmit(onSubmit)}>
            {children}
        </Form>
    )
}

【讨论】：