본문 바로가기
728x90

React-hook-form2

71. 폼 라이브러리 이름이 왜 폼? formik 함수형이 나오면서 생긴 React-hook-form 제어 컴포넌트 = redux-form, formik… = 입력할 때마다 state가 바뀌는 형태 비제어 컴포넌트 = react-hook-form =입력할 때마다 state가 바뀌지 않는 형태 = 성능이 빠르다 안녕하세요 안, 안녕 까지만 입력을 해도 state에 저장이 된다 isActive같이 버튼 색을 변경하는 것 = 제어 컴포넌트가 들어간다 텍스트가 많은 데이터는 성능이 많을 수 있기 때문에 = 비제어 컴포넌트를 사용한다 yarn add react-hook-form form안에 버튼의 주의사항 타입을 reset으로 하면 form안에 있는 것이 초기화된다 state가 지워지지는 않는다 타입을 submit으로 하면 네모친 곳.. 2023. 2. 25.
폼 라이브러리, 검증 라이브러리, 공통 컴포넌트 8/5 폼 라이브러리는 여러 종류가 있다. react-form, redux-form, formik, react-hook-form 등... 폼 라이브러리란 그동안 스프레드 연산자를 쓰고, onChangeInput, isEvery, state 등을 만들어서 직접 관리했던 폼들을 미리 만들어 놓고, 라이브러리 형태로 제공해 주는 것이 폼 라이브러리. 그 중, 최근에 함수형 컴포넌트에서 가장 많이 사용되는 폼 라이브러리가 바로 react-hook-form 검증 라이브러리 -> 오늘은 yup yup을 사용하여, 기존의 정규표현식 또는 length를 기준으로 한 최소/최대글자수, 등의 조건을 아주 쉽게 추가할 수 있다. 또한, 검증 라이브러리와 폼 라이브러리는 서로간에 독립적으로 사용될 수 있으므로, 반드시 rea.. 2021. 8. 8.
728x90