[React Docs] 2-1. useTransition (2)
·
🎨 프론트엔드 공부/React & Next
리액트 공식 문서(react.dev) 읽기 더보기 Built-in React Hooks 1. useTransition 📍참고 https://react.dev/reference/react/useTransition useTransition The library for web and native user interfaces react.dev 📍원치 않는 로딩 UI 방지하기 Suspense 컴포넌트의 fallback을 활용해 로딩 UI를 만들 수 있다- 그런데, 로딩 UI가 전체 UI 를 다 가리고 표현되면 유저 경험을 해치게 된다 UI를 변경하는 동작을 startTransiton으로 래핑하면, 이 동작은 기존 UI를 blocking하지 않는다 📍suspense 가능한 router 구축 React 팀에서는 Re..
[React Docs] 2-1. useTransition (1)
·
🎨 프론트엔드 공부/React & Next
리액트 공식 문서(react.dev) 읽기 더보기 Built-in React Hooks 1. useTransition 📍useTransition ✅UI blocking 없이 state를 변경할 수 있는 hook const [isPending, startTransition] = useTransition() 📍useTransition() ✅컴포넌트 최상단에서 useTransition() 을 호출하여 일부 상태 업데이트 (set 함수)를 transition으로 표시 import { useTransition } from 'react'; function TabContainer() { const [isPending, startTransition] = useTransition(); // ... } ✅매개변수 - 없음..