https://github.com/binghuis/how-to-use-react
https://github.com/binghuis/how-to-use-react
Last synced: 7 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/binghuis/how-to-use-react
- Owner: binghuis
- Created: 2024-01-03T04:40:09.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-01-14T03:29:55.000Z (over 1 year ago)
- Last Synced: 2025-01-26T14:11:26.091Z (9 months ago)
- Language: TypeScript
- Size: 646 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 如何使用 React
本项目按照 React 18 最新文档结合代码探索各个 Hook 、API 和 组件的实践。
---
`use`
[读取 context](./app/use-w-context/page.tsx)
[读取 Promise](./app/use-w-promise/page.tsx)
[将数据从服务器流式传递给客户端](./app/use-w-stream/page.tsx)
`useContext`
[读取 context](./app/use-context/page.tsx)
`useReducer`
[整合状态更新逻辑](./app/use-reducer/page.tsx)
---
`useState` & `flushSync`
[状态管理、异步批处理、同步更新、用 key 初始化 state、用 use-immer 优化对象/数组更新](./app/use-state/page.tsx)
`useMemo`
[值记忆化](./app/use-memo/page.tsx)
`useCallback`
[函数记忆化](./app/use-callback/page.tsx)
`memo`
[组件记忆化](./app/memo/page.tsx)
`useDeferredValue`
[UI 延迟更新](./app/use-deferred-value/page.tsx)
---
`useEffect` & `useLayoutEffect`
[副作用处理]('./app/use-effect/page.tsx')
`useEffectEvent`
`useSyncExternalStore`
---
`useRef`
`useImperativeHandle`
`forwardRef`
---
什么时候用 `memo`、`useMemo` 和 `useCallback`、`useDeferredValue`
