如何使用 react-final-form 添加或删除表单键

Question

单个配置示例显示了我用于输入的配置。

export const age = [
{
value: '',
type: 'radio',
name: 'age',
items: [
{value: 'kid', label: 'Im less than 18',
{value: 'adult', label: 'Im 18!',
],
},
];
export const someDate = [
{
type: 'date',
value: null,
name: 'someDate',
label: 'Enter date',
format: 'dd/MM/yyyy',
minDate: new Date('2019-12-31'),
maxDate: new Date('2020-03-31'),
validators: required.required.date
}
];

RFForm 是矩形最终表单组件的包装器，我将所有组件作为子组件传递其中。

<RFForm
config={[...age, ...someDate, ...somethingElse]}
submit={submit}
>
<SectionBox title="Your age">
<Box mb={5}>
<InputList inputs={age}/>
</Box>
<SectionTitle title="Date"/>
<Box maxWidth="50%">
<InputList inputs={someDate}/>
</Box>
</SectionBox>
<SectionBox title="Something else">
<Box maxWidth="50%">
<InputList inputs={somethingElse}/>
</Box>
</SectionBox>

{
conditionToHideOrShowSection && <SectionWithInputs />
}
{
buttons
}
</RFForm>

我想添加一个新部分，该部分将根据用户选择的内容隐藏或显示。仅当选择第二个单选按钮值(成人(时，该部分才应存在。该部分将包含一个组件，其中包含来自配置的输入。所有字段都应该是必填字段。仅当该部分存在时，才应验证此内容。

1. 第一个问题 - 我应该如何检查是否选中了特定的单选按钮。我无权从这里访问使用表单，我需要隐藏或显示部分。
2. 第二个问题 - 当其他输入发生变化时，如何动态添加新输入。请记住，我必须将其添加到配置(RFForm props(中，因为必须更新初始值。

Answer 1

1. 实际上您可以访问它，但可以通过其他方式通过render方法链接

2. 此示例演示如何有条件地显示输入链接。请注意，如果输入隐藏数据不会消失，它仍然存在，所以要清理，您应该使用change('inputName', undefined)(至少它对我有帮助(

3. 最后，您还应该查看有关subscription道具链接的信息。