练习Practice
动手做Get your hands on it
练习跟着课文走 —— 每节课尾都有本课的练习。这一页是全部练习的总库，想集中刷题的时候来。 每个练习都写清了它来自哪一节，卡住了就回去看那一节。Practice follows the lessons — every lesson ends with the exercises for that lesson. This page is the whole library, for when you want to drill in one sitting. Each exercise names the lesson it came from, so you can go back when you stall.
0 / 148个做对过you got right
已筛到你正在学的《React 考试》。想看全部就点上面的「全部」。Filtered to React exam — the course you are on. Use “All” above to see everything.
练习Exercises
筛出 2 个练习（共 148 个）。Showing 2 of 148.来自From useState：让界面跟着数据变useState: making the screen follow the data · React 考试React exam
L1排顺序Order it把一次点击的顺序排对Put the steps of one click in order
用户点了某一行的 Delete 按钮。把下面五件事按发生顺序排好。
The user clicked the Delete button on one row. Put the five things below in the order they happen.
1React 重新执行 NoteManager 函数，拿到新的 JSXReact runs the NoteManager function again and gets new JSX
2NoteItem 的 onClick 触发，调用 onDelete(note.id)The onClick of NoteItem fires and calls onDelete(note.id)
3React 对比新旧 JSX，把变化的部分写进真实 DOMReact compares the new JSX with the old one and writes only the differences into the real DOM
4NoteManager 里的 handleDelete 执行，调用 setNotes(...)handleDelete inside NoteManager runs and calls setNotes(...)
5React 记下 notes 的新值，标记这个组件需要重新渲染React records the new value of notes and marks this component for a re-render
来自From 先读题：三个任务、一条硬约束、四个测试Read the question first: three tasks, one rule you must not break, four tests · React 考试React exam
L1排顺序Order it把上手顺序排对Put the starting steps in order
拿到这个项目，最合理的动作顺序是什么？
You just received this project. What is the most sensible order to work in?
1写代码：三个 handler 逐个实现Write the code: implement the three handlers one at a time
2npm install，然后 npx vitest run 拿到基线npm install, then npx vitest run to get a baseline
3读 NoteForm / NoteTable / NoteItem，确认它们已经完整、不用改Read NoteForm / NoteTable / NoteItem and confirm they are already complete and need no change
4读 README + 读测试文件，抄下所有验收标准Read the README and the test file, and write down every acceptance criterion
5npx vitest run 验证，再 npm run dev 手动点一遍Verify with npx vitest run, then npm run dev and click through it by hand
6读 types/Note.ts，确认数据形状和 id 的类型Read types/Note.ts to confirm the shape of the data and the type of id