REdux 양식 : 조건에 따라 필드를 표시하십시오.

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 필드가 동적 인 동안 전화 필드는 항상 존재합니다.

내 양식을 제출이 같은 것입니다 : 내 handleSubmit 기능 내부

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

, 나는했습니다 :

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

를 자, 내가가 유효성 검사를 원하는 조건을 기반으로 원하는 작업. 전화 만 렌더링하는 경우 유효성 검사는 전화 필드 만 확인합니다. 두 경우 모두 렌더링 - 유효성 검사입니다.

사용자 필드에 조건을 부여했습니다. 조건에 따라 때때로 렌더링되거나 때로는 그렇지 않습니다.

그러나 렌더링하지 않을 때 양식을 제출할 때 렌더링되지 않았지만 사용자 이름의 유효성이 검사되는 원인으로 if 조건을 이동할 수 없습니다.

지금, 내 필요성에 따라이 유효성 검사를 어떻게 피할 수 있습니까?

Answer 1

v6에서 렌더링 된 필드 만 유효성이 검사됩니다.

그러나 props이 유효성 검사 함수의 두 번째 매개 변수로 전달되므로 조건을 테스트하려는 정보가있을 수 있습니다.