개발/React10 [React-Hook-Form] 리액트훅폼 isDirty 와 dirtyFields 의 차이 React Hook Form 의 formState 에 isDirty 와 dirtyFields 가 있는데 둘의 차이가 무엇인지 궁금해서 화면에서 값을 찍어보며 테스트를 해봤습니다. 알게 된 둘의 차이를 정리해둘게요! ✔ 개념 isDirty와 dirtyFields는 React Hook Form 라이브러리에서 사용되는 용어로, 폼의 입력값이 변경되었을 때를 감지하는 기능을 제공합니다. ✔ 차이 isDirty isDirty는 전체 폼(form)의 dirty 상태를 나타내는 boolean 값입니다. 폼 내에서 어떤 입력 필드(input field)가 변경되었는지에 관계없이, 한 번이라도 input이 변경되었다면 isDirty는 true를 반환합니다. dirtyFields dirtyFields는 객체 형태로, 변경.. 2023. 5. 28. [오류]Could not resolve dependency:npm ERR! peer react@"^17.0.1" from @toast-ui/react-editor@3.2.2 ✔ 문제 게시판 form 에 toast-ui editor를 사용하려고 하는데 다음과 같은 오류가 발생했습니다. 지금 제 react 버전과 맞지 않아서 생긴 오류로 보이는데 editor 때문에 리액트 버전을 낮추고싶지는 않았어요 ✔ 해결과정 다른 editor를 사용하는 방법도 있지만, 우선 한국어가 잘 적용되는 toast-ui editor를 사용하고 싶었습니다. 캡쳐 화면을 보면 --force 를 붙여서 충돌을 우회하든지 --legacy-peer-deps로 충돌을 무시하라고 나와있어요. 저는 --force로 충돌을 우회하였습니다. npm install --save @toast-ui/react-editor --force 우선 import 하는데 까지는 성공했습니다. 그런데 좋아보이진 않아요. warning이.. 2022. 11. 6. [React] useRef 와 useState 개념, 차이 전에 정리하려고 했던 useRef(), useState() 차이를 설명해보겠습니다. ✔ 개념 useState( ) 란? const [state, setState] = useState(initialState); 상태 유지 값(state) 과 그 값을 갱신하는 함수(setState) 를 반환합니다. setState 함수는 state 를 갱신할 때 사용합니다. initialState 인자는 초기 렌더링 시에 사용하는 state입니다. 그 이후의 렌더링 시에는 이 값은 무시됩니다. const [state, setState] = useState(() => { const initialState = someExpensiveComputation(props); return initialState; }); // 예시 co.. 2022. 10. 18. forEach, for...of, for...in 차이 안녕하세요 react 에서 for문을 사용하였는데 for보다는 forEach를 사용하는게 좋을 것 같다는 피드백을 들었습니다. 그래서 forEach로 바꿔봤더니 더 간단하더라고요! forEach, for of, for in 때에 따라 맞는걸 사용하면 된다고 들었습니다만, 모르니까 공부 시작!! ✔ forEach 문 배열의 요소와 인덱스 모두에 접근할 수 있습니다. 반면 예외를 던지지 않고는 forEach()를 중간에 멈출 수 없습니다. 중간에 멈춰야 한다면 forEach()가 적절한 방법이 아닐지도 모릅니다. mdn에 forEach 검색하니까 바로 for 문을 forEach() 로 바꾸는 방법이 나왔습니다. 이후가 훨씬 깔끔하죠? const items = ['item1', 'item2', 'item3'].. 2022. 10. 13. 이전 1 2 3 다음
