Redux表单字段组件和验证

问题描述

我正在使用redux来基于值隐藏和显示组件.

I am using the redux to hide and show components based on a value.

Redux表单文档提到以下内容:

The Redux form documentation mentions the following:

我不清楚基于单选按钮隐藏和显示字段的解决方案是否足以使用Fields给出警告，请谨慎使用.

I am unclear if my solution to hiding and showing fields based on radio buttons is good enough to use Fields giving the warning to use sparingly.

能否请您说明我的组件是否有足够的理由使用Fields.如果没有，什么是替代的实现方式?

Can you please clarify if my component merits enough reason to use Fields. If not, what is an alternative way to implement?

此外，fields如何实现验证?

<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>
     );
  }

推荐答案

还有另一种方法，可以使用redux-form选择器( http://redux-form.com/6.0.5/docs/api/Selectors.md/)将redux存储在您的mapStateToProps中，然后有条件地渲染某些组件.

There is another way you could do that, selecting the specific value using redux-form selectors (http://redux-form.com/6.0.5/docs/api/Selectors.md/) from the redux store in your mapStateToProps and then conditionally rendering certain components.

但是，我认为Fields正是您在这种情况下应该使用的.我认为警告主要是在警告人们不要将其整个表单放到Fields中，重新渲染这3个字段没什么大不了的.

However, I think that Fields is exactly what you should use in this circumstance. I think that warning is largely to warn people not to go and put their entire form into Fields, having those 3 fields rerender is no big deal.

首先导致创建Fields的思考过程可能是处理此问题的最佳方法:"> https://github.com/erikras/redux-form/issues/841

The thought process that led to the creation of Fields in the first place is probably the best way to get a handle on this: https://github.com/erikras/redux-form/issues/841

这篇关于Redux表单字段组件和验证的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！