frontStudySession / sam

front chapter assignment
0 stars 0 forks source link

form review #3

Open kellywoo opened 7 months ago

kellywoo commented 7 months ago

https://github.com/frontStudySession/sam/blob/main/src/app/Form.tsx#L6 // 오오 resolver 쓰신분 처음~

https://github.com/frontStudySession/sam/blob/main/src/app/Form.tsx#L29 // 구글 존재 이메일입니다.

image

https://github.com/frontStudySession/sam/blob/main/src/app/Form.tsx#L104 // 같은 register 객체를 쓰는 곳은 각각 넣으시는 것보다 하나로 생성해서 넣으시는 것이 수정이나 변경에서 더 좋습니다.

const radioRegister = register(...)
<input type="radio" {...radioRegister}/>
<input type="radio" {...radioRegister}/>

https://github.com/frontStudySession/sam/blob/main/src/app/Form.tsx#L90 // 👍 input tel~ 하지만 웹에서 숫자 이외의 글자가 입력됩니다.

https://github.com/frontStudySession/sam/blob/main/src/app/Form.tsx#L121 // default로 submit이 나오지만 되도록이면 value로 적어주세요.

samankey commented 7 months ago

리뷰 감사합니다! resolver를 사용한 큰 이유는 없고 문서에 복잡한 유효성 체크를 resolver를 사용해서 가능하다고 하여 적용해봤습니다.

한 컴포넌트 내부에 지금처럼 여러 input field가 있을 수 있는데, 테스트 해보고 싶었던건 name 관련 field는 resolver로 처리하고 나머지는 inline으로 처리하고 싶었습니다. 그런데 formState: { errors } 에서 동일하게 errors 로 사용해서 그런지 resolver로 처리한 errors 만 유효성 체크가 되고 나머지 필드는 인식하지 못하는 경우가 있었습니다.

혹시 이런 경우에는 따로 처리하는 방법이 있을까요? 제가 찾아본 자료까지는 resolver 사용하는 컴포넌트 내부에서는 모든 필드의 유효성 검사가 resolver를 통해야 한다고 하던데... 좀 더 찾아봐야할 것 같습니다!