Question

假设我有一个像这样的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条件内，因为虽然没有渲染用户名，但验证用户名。

现在，我如何根据需要避免这种验证。

Answer 1

在v6中，只会验证呈现的字段。

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

REdux表格：根据条件

1 个答案: