如何在 react-admin 的视图中将无状态组件输入绑定到其他输入答案

【问题标题】：How to bind a Stateless Component Input to other Inputs in react-admin's views如何在 react-admin 的视图中将无状态组件输入绑定到其他输入
【发布时间】：2019-08-07 19:38:10
【问题描述】：

阅读了官方文档here，我发现了这些声明

...<Field> 组件可以通过其上下文访问当前记录。 name 属性用作要编辑的记录属性的选择器。

然后，我试着理解这个实验的陈述：

const CustomInput1 = () => (
     <span>
         <Field name="title" component="input" />
     </span>
);

export const PostCreate = (props) => (
    <Create {...props}>
        <SimpleForm>
            <TextInput source="title" />
            <CustomInput1/>
        </SimpleForm>
    </Create>
);

事实证明，Field 的 prop name 和 TextInput 的 prop source 是绑定在一起的，也就是说，每当我对一个输入进行任何更改时，另一个输入的值也会相应地发生变化。

我的问题是。为什么不能像这样使用 Stateless Component 来重现同样的效果？

const CustomInput2 = ({ record, source }) => (
  <input type="text" value={record[source]}/>;
);
export const PostCreate = (props) => (
    <Create {...props}>
        <SimpleForm>
            <TextInput source="title" />
            <CustomInput2 source="title"/>
        </SimpleForm>
    </Create>
);

据我了解，后一种情况下的两个输入都绑定到 record['title'] 并且它们共享相同的 record 对象，不是吗？

我这样做的实际原因是我想根据单个输入的更新来更改所有其他输入的值。我的幼稚理解是，这可以通过共享record 来实现。

【问题讨论】：

标签： reactjs input bind react-admin stateless

【解决方案1】：

所以不行，使用 FormDataConsumer 来解决你的问题：

https://marmelab.com/react-admin/Inputs.html#linking-two-inputs

【讨论】：