C23

看板综合题

预览

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

任务说明

React 沙箱

实现任务看板：待办/进行中/已完成三列，默认任务为「搭建脚手架（待办）」「写周报（进行中）」「复盘会议（已完成）」。支持：「新任务名称」输入 + 「添加任务」按钮（新增到待办）；每行「移动任务名」（待办→进行中→已完成，已完成行没有移动按钮）与「删除任务名」按钮（按钮文案都要包含任务名）；「搜索任务」输入过滤（计数行「共 N 个任务 · 匹配 M 个」）；点任务标题选中，详情显示「选中：任务名（列名）」；删除选中任务后详情回到「未选中任务」；数据持久化到 localStorage，重新渲染后恢复。

要求

初始显示三列与三个默认任务，「共 3 个任务 · 匹配 3 个」；添加「写文档」后出现在待办且计数变为「共 4 个任务 · 匹配 4 个」
重新渲染（新的 App 实例）后「写文档」仍在——数据已持久化到 localStorage
点「移动写周报」后写周报出现在「已完成」列标题之后（进入已完成列）
搜索「周」时「匹配 1 个」且不显示「搭建脚手架」；点「复盘会议」标题显示「选中：复盘会议（已完成）」，点「删除复盘会议」后任务消失且详情显示「未选中任务」

R22 复杂状态综合实践 R55 React 看板项目实战

分层提示

先自己试，再逐层展开。

参考答案

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

看板综合题

Command Palette