我需要使用 react-admin 构建一个复杂的编辑表单。该表单有各种是/否 slider ,是使用 react-admin 的 BooleanInput 组件制作的。 如果用户将 slider 设置为"is",则应动态显示更多表单字段,这些字段在主题上与 slider 相关。我如何查询 BooleanInput 组件的状态,或者这个任务是否会以不同的方式在 React 中解决?
<BooleanInput source="yesno" label="show or hide fields" />
<AutocompleteArrayInput source="probably_hidden1" label="show or hide me" choices={[
{ id: 'one', name: '1' },
{ id: 'two', name: '2' },
{ id: 'three', name: '3' }
]} />
<TextInput multiline source="text" label="show or hide me too" />
最佳答案
我发现:可以像这样使用 FormDataConsumer 来完成:
<BooleanInput source="yesno" label="show or hide fields" />
<FormDataConsumer>
{({ formData, ...rest }) => formData.yesno && <div>
<AutocompleteArrayInput source="yesno" label="show or hide fields" choices={[
{ id: 'one', name: '1' },
{ id: 'two', name: '2' },
{ id: 'three', name: '3' }
]} {...rest} />
<TextInput multiline source="text" label=""show or hide me too" {...rest} />
</div>
}
</FormDataConsumer>
参见: https://marmelab.com/react-admin/Inputs.html#hiding-inputs-based-on-other-inputs
关于javascript - 如何根据 react-admin 中 BooleanInput 字段的状态动态显示或隐藏表单字段?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59819489/