함수 반환 함수가 redux 양식 필드 수준 유효성 검사에 대해 작동하지 않습니다.

Question

It`sa 이상한 행동을 비트,하지만 내 검증 :

와 세드릭 나는 실제로 내가 필드 레벨 검증

export const confirm = (valueToConfirm, message) => (value, allValues) => { 
    if (value !== allValues[valueToConfirm]) { 
    return message; 
    } 

    return undefined; 
}; 

그리고 그와 같은 사용을 알아낼 수 없습니다

<Field 
    type="email" 
    name="confirmEmail" 
    component={TextInput} 
    validate={[required, email, confirm('email', 'Bla-bla-bla')]} 
/> 

그리고 다른 검증이 실패했을 때만 thats가 실제로 작동합니다. 따라서 사용자 입력이 모든 필드를 수정하고 confirmEmail이 전자 메일과 일치하지 않는 경우 - 은 유효성 검사 오류가 아닙니다!

그러나 유효성을 변경하면 함수를 반환하는 함수가 아닙니다. 작동합니다.

export const confirmEmail = (value, allValues) => { 
    if (!value || value !== allValues.email) { 
    return 'Bla-bla-bla'; 
    } 

    return undefined; 
}; 

P. 모든 필드 수준 유효성 검사와 동일합니다 (예 : minLength 동적 확인).

Answer 1

나는 당신이 Redux Field를 사용하고 있다는 것을 알고 있지만 이것은 바닐라 리 액트에서도 쉽게 달성 할 수 있습니다.

<form> 
<input 
       type="text" 
       name="username" 
       placeholder="name" 
       value={this.state.username} 
       onChange={this.handleChange}/> 
</form> 

handleChange(e) { 
    //check for validation here to have real time feedback to user when their 
    inputs match what you're looking for. 

} 

Answer 2

유효성 검사 기능이 올바르지 않습니다. confirm입니다. 사용중인 검증 기능 : 사용중인 인수

export const confirm = (valueToConfirm, message) => (value, allValues) => { 
    if (value !== allValues[valueToConfirm]) { 
    return message; 
    } 

    return undefined; 
}; 

:

confirm('email', 'Bla-bla-bla') 

는 항상 유효성 검사를 의미합니다. email 입력의 값이 email 속성의 값인 allValues에 유효한지 확인합니다.이 값은 email 값입니다. 즉 : 유효성 검사가 통과 할 것이다 의미

if (test@example.com !== test@example.com) { 
    return 'Bla bla bla'; 
} 

이 조건 항상 실패합니다 평가

// value = test@example.com 
// allValues = {email: 'test@example.com'} 
// valueToConfirm = 'email' 
// message = 'Bla bla bla' 

if (value !== allValues[valueToConfirm]) { 
    return 'Bla bla bla'; 
} 

.