五、框架场景题：把知识落到代码
把相关知识和复习方法放在一起，随时回看。
| 场景题 | Vue 侧重点 | React 侧重点 |
|---|---|---|
| 搜索结果被旧响应覆盖 | watcher / 请求清理，请求标识，状态归属 | Effect 清理或事件请求控制，闭包与请求标识 |
| 编辑弹窗关闭重开仍是旧数据 | props 草稿、重置时机、实例复用 | 状态初始化只执行一次、key、受控表单 |
| 列表排序后输入内容串行 | key 与组件本地状态 | key 与状态在树中的身份 |
| 页面退出后仍持续请求 | 销毁 / 失活清理、异步 watcher | Effect cleanup、旧任务隔离 |
| 大表格更新很慢 | 响应范围、稳定 props、浅层状态、虚拟化 | 状态位置、重渲染、引用稳定、虚拟化 |
| 多个组件共享数据但互相覆盖 | store 边界、实例隔离、请求竞争 | Context / store 边界、自定义 Hook 状态是否共享 |
| 父组件拿不到子组件方法 | 挂载时机、条件渲染、Vue3 expose | ref、命令式接口、React 版本差异 |
| 刷新 SSR 页面报错或内容跳变 | 浏览器对象、请求状态隔离、水合一致性 | 服务端 / 客户端边界、初始快照、水合一致性 |
练习时选择自己最熟悉的框架，实现一个真实接口查询页：筛选、分页、编辑弹窗、加载 / 空 / 错误状态、请求乱序处理。再用另一个框架做同一功能，对照状态归属与清理机制。