渐进式编程课
React 目录
第 13 课2026.09.16

不可变地删除一条课程记录。

第 13 课:按id删除数组状态

  • 日期:2026-09-16
  • 课程序号:第 13 课
  • 知识点:按id删除数组状态

用途

不可变地删除一条课程记录。

核心概念

filter 返回新数组;保留 id 不匹配的元素即可删除目标项。

最小代码或操作示例

text
setLessons(items => items.filter(item => item.id !== id))

3~5 分钟练习

为每行增加删除按钮。

参考答案

onClick={() => removeLesson(item.id)}

与上一课的联系

继承上一课的不可变追加;本课只增加删除;下一课可实现按 id 更新。

时效校验

时效校验:2026-09-16(React 当前官方指南)。已打开并核对下列官方资料;未发现本课主方案存在废弃标记。

官方参考