[typescript error: react-hook-form] Type 'string' is not assignable to type 'boolean | undefined'.

어느 덧 todolist로 react-hook-form 입문!
그런데 password input에서 required: "too short"를 입력하려고 하는데 자꾸 타입 에러가 나는 것이었다.
나도 required:"Password를 입력하세요" 쓰고 싶다! 유저가 비밀번호 대충 입력 안하고 넘어가면 간지나게 에러메시지 띄우고 싶다!


길고 긴 에러메시지...

나의 코드

function ToDoList() {
  const { register, handleSubmit, formState } = useForm();
  const onValid = (data: any) => {
    console.log(data);
  };
  console.log(formState.errors);
  return (
    <div>
      <form
        style={{ display: "flex", flexDirection: "column" }}
        onSubmit={handleSubmit(onValid)}
      >
        <input {...register("Email", { required: true })} placeholder='Email' />{" "}
        <input
          {...register("firstName", { required: true })}
          placeholder='firstName'
        />{" "}
        <input
          {...register("lastName", { required: true })}
          placeholder='lastName'
        />{" "}
        <input
          {...register("userName", { required: true, minLength: 10 })}
          placeholder='userName'
        />{" "}
        <input   //🧐🧐문제의 input 태그🧐🧐
          {...(register("password"), { required: "too short", minLength: 5 })}
          placeholder='password'  
        />
        <input
          {...register("pwConfirmation", { required: true, minLength: 5 })}
          placeholder='pwConfirmation'
        />{" "}
        <button>Add</button>
      </form>
    </div>
  );
}
export default ToDoList;

문제는 괄호였다.
register 앞뒤로 괄호를 빼니 해결되었다. ㅎㅎ.. 허무하구만 여튼 해결되서 다행!

      <input
         {...register("password", { required: "hello", minLength: 5 })}
         placeholder='password'  //🥹🥹더 이상 타입 오류 없는 input 태그🥹🥹
        />

괄호 문제로 타입 에러가 날 수 있다니 .. 살짝 충격쓰
에러가 날 경우 괄호까지 검토해야겠다 ㅎㅎ..

에러 해결했으니 밥먹고 돌아와야지~~~