REdux Form : 根据条件显示字段答案

【问题标题】：REdux Form : Display fields upon conditionREdux Form : 根据条件显示字段
【发布时间】：2016-07-06 21:21:27
【问题描述】：

假设我有一个类似这样的 redux 表单。

    {!this.state.username &&
      <div>
        <label>Username </label>
        <div>
          <input type="text" placeholder="eg. Shantanu Anand" {...username}/>
        </div>
       {username.touched && username.error && <div className = 'inputError'>{username.error}</div>}
      </div>
    }
    <div>
      <label>Phone Number</label>
      <div>
        <input placeholder="000-000-000" type="text"  {...phone} defaultValue="Hello!"/>
        {phone.touched && phone.error && <div className = 'inputError'>{phone.error}</div>}
      </div>
    </div>

现在电话字段始终存在，而 fullName 字段根据某些条件检查是动态的。

我的表单提交是这样的：

      <button className = 'registerFormBtn' type="submit" onClick={this.handleSubmit.bind(this)} disabled={submitting}>
        {submitting ? <i/> : <i/>} Submit
      </button>

在我的 handleSubmit 函数中，我已经：

if(_this.props.valid){
    //if all fields are valid.
   //my logic for form data posting, 
 }

现在，我想要的是基于我希望验证工作的条件。如果仅渲染电话，则仅对电话字段进行验证检查。如果两者都呈现 - 验证两者。

我已经为用户名字段提供了一个条件，根据条件有时会呈现有时不会呈现。

但是当它不呈现时，在提交表单时，我无法在 if 条件内移动，因为用户名正在被验证，尽管它没有呈现。

现在，如何根据需要避免此验证。

【问题讨论】：

标签： reactjs redux redux-form

【解决方案1】：

在v6 中，只有被渲染的字段才会被验证。

但是，您应该会发现 props 作为第二个参数传递给您的验证函数，因此您试图测试您的条件的信息可能在其中。

【讨论】：