react 훅 (2) 썸네일형 리스트형 [React] React Router의 Form vs useFetcher().Form fetcher.Form은 페이지 전환 없이 백그운드에서 데이터를 변경하거나 제출해야 할 때 사용합니다. 1. 일반 Form페이지 전환이 발생 전체 페이지가 다시 로드됨 주로 주요 CRUD 작업에 사용 (예: 새 이벤트 생성, 이벤트 수정)2. useFetcher() .Form페이지 전환 없음 백그라운드에서 데이터 처리 주로 작은 업데이트나 부분적인 데이터 변경에 사용 (예: 좋아요 버튼, 구독 신청, 댓글 작성, 상태 토글 (예: 완료/미완료) ) 예시 ) import { useFetcher } from 'react-router-dom';function NewsletterSignup() { const fetcher = useFetcher(); return ( 구독하기.. [React] React Router의 useNavigation 훅 - state와 주요 속성 useNavigation 이 훅은 페이지 탐색에 대해 알아야 할 모든 것을 알려주어 보류 중인 탐색 표시기와 데이터 변이에 대한 최적화된 UI를 구축할 수 있습니다. 글로벌 로딩 표시기변경이 발생하는 동안 양식 비활성화하기제출 버튼에 사용 중 표시기 추가하기서버에서 새 레코드가 생성되는 동안 새 레코드 상태를 낙관적으로 표시하기업데이트되는 동안 레코드의 새 상태를 낙관적으로 표시하기 1. navigation.state 현재 네비게이션 상태를 나타내는 속성입니다.3가지 상태 값 중 하나를 반환한다"idle" - 기본 상태, 현재 네비게이션이 진행되지 않고 있음"loading" - 데이터를 불러오는 중이거나 페이지 전환이 진행 중"submitting" - 폼 제출과 같은 데이터 변경 작업이 진행 중 보통의.. 이전 1 다음
