본문 바로가기

react 폼 처리

(2)
[React] React Router의 useFetcher 훅 - 주요 속성 useFetcher는 페이지 전환 없이 서버와 데이터를 주고받을 수 있게 해주는 React Router의 훅입니다.useNavigate 훅과 세트로 기억하시면 좋습니다  1. fetcher.Formhttps://daunje0.tistory.com/201 [React] React Router의 Form vs fetcher.Formfetcher.Form은 페이지 전환 없이 백그운드에서 데이터를 변경하거나 제출해야 할 때 사용합니다. 1. 일반 Form페이지 전환이 발생 전체 페이지가 다시 로드됨 주로 주요 CRUD 작업에 사daunje0.tistory.com  2. fetcher.submit// 프로그래밍 방식으로 데이터 제출fetcher.submit( { email: 'test@test.com' }, ..
[React] React Router의 useNavigation 훅 - state와 주요 속성 useNavigation 이 훅은 페이지 탐색에 대해 알아야 할 모든 것을 알려주어 보류 중인 탐색 표시기와 데이터 변이에 대한 최적화된 UI를 구축할 수 있습니다. 글로벌 로딩 표시기변경이 발생하는 동안 양식 비활성화하기제출 버튼에 사용 중 표시기 추가하기서버에서 새 레코드가 생성되는 동안 새 레코드 상태를 낙관적으로 표시하기업데이트되는 동안 레코드의 새 상태를 낙관적으로 표시하기 1. navigation.state  현재 네비게이션 상태를 나타내는 속성입니다.3가지 상태 값 중 하나를 반환한다"idle" - 기본 상태, 현재 네비게이션이 진행되지 않고 있음"loading" - 데이터를 불러오는 중이거나 페이지 전환이 진행 중"submitting" - 폼 제출과 같은 데이터 변경 작업이 진행 중 보통의..