react-hook-form
-
react-hook-form을 사용하여 배열 형태 input 사용Language/React 2024. 12. 2. 12:32
배열형태의 Input을 처리하는 방식을 정리해 둔다. ChatGPT 예시import React from "react";import { useForm, useFieldArray, Controller } from "react-hook-form";function MyForm() { // react-hook-form의 useForm 훅 사용 const { control, handleSubmit, register, formState: { errors } } = useForm({ defaultValues: { users: [{ name: "" }] // 기본값으로 하나의 입력 필드를 넣음 } }); // useFieldArray 훅을 사용하여 동적으로 필드 추가 및 제거 const { ..
-
react-hook-form typescript로 변환 및 컴포넌트 생성 (antd)Language/React 2023. 12. 27. 17:42
이번 포스팅에서는 react-hook-form을 전체 사이트에 적용하기에 앞서 코드 라인을 줄여서 가독성을 높이고 타입스크립트로 컴포넌트를 제작해 두려고 한다. 현재 javascript 및 typescript가 혼재 되어 있지만.. 시간될때 마다 수정해 나가자! 언젠간.. typescript만 남으리라!! react-hook-form component 적용import { useForm } from 'react-hook-form';import { NInput, NInputNumber, NTextArea, NCheckbox, NSelect, NRadioGroup, NTinyMceEditor, NImageSelector } from 'components/FormControls';const TestPop = (..
-
react-hook-form 적용기 (antd)Language/React 2023. 12. 18. 13:18
구 버전의 node 14.17.4 + react 16.13.1 에서 react-hook-form을 적용해보자. react-hook-form은 Node 16.0.0 이상을 권장한다고 하는데 다음 분기때 버전 올릴 계획도 있고 백오피스에 적용하는거라서 큰 문제가 발생하지 않는다고 판단되어 적용하기로 하였다. 이런 저런 핑계로 지금 안하면 나중에도 못한다.! Node버전과 React버전 별 사용가능한 react-hook-form 버전 Node 버전 React 버전 react-hook-form 버전 12.17.0 이상 16.8.0 이상 7.3.0 이상 14.17.0 이상 16.13.0 이상 7.3.0 이상 16.0.0. 이상 17.0.0 이상 7.3.0 이상 17.0.0. 이상 18.0.0 이상 7.3.0 이상..