共 17 节,按顺序
- 125 分钟
什么是 React?
What React isComponents as functionsVirtual DOM intuitionRendering JSXCreating a Vite app - 230 分钟
JSX 与组件
JSX syntax rulesSingle root elementClassName vs classEmbedding expressions with {}Defining componentsComposing components - 330 分钟
属性
Passing props as attributesReceiving props objectDestructuring props in signatureDefault valuesThinking about prop shapes - 435 分钟
使用 useState 管理状态
UseState hookReading stateCalling the setterUpdater function formNever mutate stateCounter pattern - 530 分钟
处理事件
OnClick handlerOnChange basicsPassing functions vs calling themEvent objectPassing handlers as props - 630 分钟
条件渲染与列表
&& for show/hideTernary for either/orMapping arrays to JSXThe key propWhy keys need to be stable - 735 分钟
表单与受控输入
Controlled input patternValue and onChange togetherMulti-field form stateOnSubmit and preventDefaultGathering form data - 840 分钟
使用 useEffect 实现副作用
What counts as a side effectUseEffect signatureDependency arrayRunning on mount onlyCleanup functionSubscribe/unsubscribe pattern - 935 分钟
组件组合
Children propWrapping componentsPassing JSX as propsLifting state upThinking in component trees - 1035 分钟
Context 与 useContext
CreateContextContext.ProviderUseContextWhen context is the right toolContext vs prop drilling tradeoffs - 1135 分钟
useReducer
When to reach for useReducerReducer function shapeAction objectsDispatchCombining useReducer with useContext - 1235 分钟
自定义钩子
Extracting stateful logic into a functionUse prefix conventionUseToggle exampleUseLocalStorage exampleHooks rules - 1335 分钟
性能与记忆化
React.memo for componentsUseMemo for expensive computationsUseCallback for stable function referencesWhen memoization is overkillMeasuring before optimizing - 1440 分钟
数据获取
Fetch inside useEffectLoading/error/data statesAbortController cleanupPreventing setState after unmountMention TanStack Query as a next step - 1540 分钟
使用 React Router 进行路由
Installing react-router-domBrowserRouterRoutes and RouteLink for navigationUseParamsUseNavigate - 1640 分钟
测试 React 组件
Vitest + React Testing Library setupRender and screenGetByRole queriesUserEvent for interactionsWriting one good button test - 1760 分钟
顶点项目:待办事项应用
Combining state, lists, controlled inputsCustom hook for localStorage persistenceSmall routing setupPutting it together
用你的语言学习 React
每一节课、测验和导师回复都以你的语言显示。AI 导师会用你提问的语言来回答。
