Redux表单清除字段值

时间:2017-03-29 19:01:43

标签: reactjs redux redux-form react-redux-form

我使用redux来隐藏和显示基于值的组件。 当我在选项之间切换时,我想清除这些值。

如何在隐藏和显示字段之间切换时清除状态值?

验证每个字段的推荐方法是什么?

是否可以从州中完全删除该字段?

<div>
    <form>
      <Fields
       component={RadioButtonGroupField}
       names={['radioButtonGroup', 'nameTextField', 'nickNameTextField']}
      />
    </ form>
</div>

function RadioButtonGroupField(fields) {
    return(
      <div>
        <RadioButtonGroupComponent
          {...fields.radioButtonGroup.input}
          {...fields.radioButtonGroup.meta}
        />
        {
          (fields.radioButtonGroup.input.value === 'name' ||
          fields.radioButtonGroup.input.value === 'both') &&
          <NameTextFieldComponent
            {...fields.radioButtonGroup.input}
            {...fields.radioButtonGroup.meta}
          />
        }
        {
          (fields.radioButtonGroup.input.value === 'nickname' ||
          fields.radioButtonGroup.input.value === 'both') &&
           <NicknameTextFieldComponent
            {...fields.radioButtonGroup.input}
            {...fields.radioButtonGroup.meta}
          />
        }
      </div>
     );
  }

1 个答案:

答案 0 :(得分:0)

为什么另一个值处于状态是否重要?您似乎可以在提交时查看您的无线电值以确定要使用的其他值。

但是,要回答您的问题,您可能会在您的广播字段中放置一个onChange侦听器,并且(不要忘记调用fields.radioButtonGroup.input.onChange())调度change(value==='name' ? 'nickname' : 'name', null)操作以销毁您要忽略的输入中的值。