react-hook-form

Practice

[Closet]React-Hook-Form의 Reset

앞서서 이미지를 서버에 업로드하고, multer 를 통해 이미지를 저장한 다음, vision AI 를 통해서 현 이미지를 분석하여 이미지의 주소와 분석결과를 클라이언트에서 받아 Preview Card 를 렌더했었다. 그리고 그 전 이미 의류이름과 가격 등등 입력값들을 React-Hook-Form 을 통해서 관리하고 있었고, 이제 실제 데이터베이스에 입력값을 저장할 일만 남아있다. 그리고 저장된 의류 데이터를 수정할 수 있어야 했기에 기존 입력 데이터를 불러와 input 창에 기입되어 있는 상태로 렌더하는 경우도 고려해야했다. 정리해보자면, 받아온 이미지 주소와 함께 React-hook-form 에서 관리하는 입력값들을 서버 데이터베이스에 저장 상세 페이지에서 정보를 수정하고자 할 경우, 수정 이벤트 발생..

Practice

[Closet]React-hook-form을 통해 입력폼 구성하기

입력 폼은 웹페이지를 구성할 때 빠지지 않고 포함되며, 그렇기에 html 내 input 의 type 들 역시 기본적인 입력부터 시작하여 number, tel, select, color, file 등등 다양하게 존재한다. 상황마다 달라지겠지만 기본적으로는 이메일과 비밀번호를 입력하는 로그인부터, 유저의 다양한 정보들을 한번에 전송해야 하는 입력폼을 생성해야할 때도 존재한다. 진행중인 closet 프로젝트에도 입력폼은 반드시 포함되었어야 했는데, 당연하게도 로그인 및 회원가입때의 입력폼과, 프로젝트의 핵심이라 할 수 있는 의류들의 정보들을 입력하게 될 add 페이지와 입력했던 의류정보를 수정하게 될 detail 페이지에서 사용될 입력폼이 필요했고, 그렇기에 좀 더 입력폼을 구현하는데 수월한 방법이 없을 까 ..

Yelihi
'react-hook-form' 태그의 글 목록