본문으로 건너뛰기

getErrors

</> getErrors: UseFormGetErrors v7.86.0부터​

getErrors는 검증을 실행하거나 오류 변경을 구독하거나 리렌더링을 발생시키지 않고 현재 폼에 저장된 오류를 읽습니다. 반응형 오류 UI에는 formState.errors 또는 useFormState를 사용하세요.

Props(속성)​

이름타입설명
nameundefined현재 저장된 모든 오류를 반환합니다.
string필드, 상위 또는 전역 오류 경로(root, root.*, form, form.*)의 오류나 undefined를 반환합니다. 상위 경로는 중첩된 오류 하위 트리를 반환할 수 있습니다.
string[]각 경로의 결과를 같은 순서로 반환합니다. 존재하지 않는 오류는 undefined로 유지됩니다.
예시​
import { useForm } from "react-hook-form"

type FormInputs = {
  email: string
  user: {
    firstName: string
  }
}

export default function App() {
  const { register, getErrors } = useForm<FormInputs>({
    mode: "onChange",
  })

  const readErrors = () => {
    const allErrors = getErrors()
    const userErrors = getErrors("user")
    const [emailError, firstNameError] = getErrors(["email", "user.firstName"])

    console.log({
      allErrors,
      userErrors,
      emailError,
      firstNameError,
    })
  }

  return (
    <form>
      <input {...register("email", { required: true })} />
      <input {...register("user.firstName", { required: true })} />
      <button type="button" onClick={readErrors}>
        Read errors
      </button>
    </form>
  )
}