React Hook 양식 필드 배열 유효성 검사가 작동하지 않습니다.

Question

required 和 minLength와 같은 일부 유효성 검사 규칙을 설정한 입력 필드가 있는 필드 배열이 있습니다.

새 필드가 추가되면 즉시 유효성이 검사되기를 원합니다. 그러나 이런 일은 발생하지 않으며 빈 필드를 추가하더라도 이러한 입력 필드에 대한 오류는 정의되지 않은 상태로 유지됩니다.

으아악

다음은 검증이 필요한 제어 입력입니다.

으아악

여기에서 작업 코드와 상자 예제를 볼 수 있습니다. 변경할 때마다 유효성을 확인하려면 어떻게 해야 합니까?

Answer 1

배열에 필드를 추가하는 이 함수의 append 方法是异步的，执行验证的 trigger 方法也是异步的，因此存在竞争条件，导致在向数组注册字段之前触发验证形式。在添加数组字段时触发重新验证之前，您可以只 await 결과입니다.

으아악

귀하의 CSB를 여기에서 포크했습니다. 또한 구성 요소가 설치될 때 유효성 검사를 트리거하는 useEffect 후크도 추가했습니다.