C15

请求竞态

预览

点击「运行」在隔离沙箱中预览

任务说明

React 沙箱

修复课程切换的请求竞态：点「React 入门」「Hooks 深入」按钮加载课程详情，快速连续切换时页面必须始终显示最后一次选择的课程，过期响应不能覆盖新结果。数据通过 prop 注入：App({ fetchCourse })，fetchCourse(id) 返回 Promise<{ id, name, lessons: string[] }>；不能用真实网络，测试用可控 Promise 模拟延迟与乱序。

要求

初始显示「选择一门课程」；点击课程按钮后先显示「加载中…」，数据返回后显示「课程：名称」与课时列表
注入 reject 的 fetchCourse 时显示「加载失败，请重试」
先点 React 入门再点 Hooks 深入：Hooks 的响应先到则立即显示 Hooks；React 的响应迟到后页面仍是 Hooks 深入，不出现 React 入门的课时「JSX 与组件」
迟到响应到达后页面不处于「加载中…」

R26 请求竞态与取消

分层提示

先自己试，再逐层展开。

参考答案

卡住时再看；查看操作会记录下来用于复盘。测试版本 1.0.0

请求竞态

Command Palette