C203 / 课堂讲义更新于
Verify:亲手证明它真的能用
补全编辑、删除与本地保存,用六项测试验证每个操作。
本节目标
- 补齐编辑、删除和 localStorage 持久化
- 逐条执行 T01–T06 并记录通过/失败
- 用「复现→定位→再验证」处理真实问题
本节目标
把 CRUD 补完整,然后用六项测试亲手证明它真的能用:
- 补齐:编辑、删除(带确认)、本地保存。
- 逐条执行 T01–T06,记录「通过 / 失败」。
- 遇到问题:复现 → 定位修改 → 再次验证。
本节交付:一份六项测试的真实记录。
课前先知道:页面能操作,不代表数据可靠
三个问题先放在这里:
- 保存后刷新:数据还在吗?
- 修改后重开:内容被更新了吗?
- 删除后刷新:删掉的笔记又回来了吗?
本课用 localStorage,验证的是同一浏览器的本地保存。刷新是检验数据是否可靠的最简单动作。
跟着做:把 CRUD 补完整
继续给 AI 一个限定范围的任务——只补缺失功能,不推翻重做:
- 编辑:修改标题和正文,保存后再次打开。
- 删除:需要明确的触发和二次确认。
- 保存:刷新页面后,未删除的笔记还在。
界面保持简单清晰,这一节不比拼美观。
跟着做:六项测试
先做前半段——证明能新建、能查看、能编辑:
| 测试 | 操作 | 预期结果 |
|---|---|---|
| T01 | 首次打开 | 显示空状态,不崩溃 |
| T02 | 新建标题 A、正文 B | 列表出现 A,打开能读到 B |
| T03 | 把 A 改成 A2 | 列表和详情都显示 A2 |
再做后半段——证明刷新之后结果也成立:
| 测试 | 操作 | 预期结果 |
|---|---|---|
| T04 | 刷新页面 | A2 和正文仍在 |
| T05 | 确认删除 A2 | 列表中 A2 消失 |
| T06 | 再次刷新 | A2 不会重新出现 |
操作要点:
- 每条自己动手。可以用自己的学习内容代替 A/B,但要保证别人照着步骤能复现。
- 先做 T04 再做删除,否则删完就证明不了「未删除的笔记能保存」。
- T02 不只看按钮响应,要进入详情读到正文;T03 要保存后重新打开核对;T06 必须真刷新,不是切换页面。
- 最容易漏掉的,是删除后的持久化。
遇到失败:最小修复
AI 说「完成了」,不等于软件真的完成了。发现失败时:
- 复现:写清操作步骤和实际现象。
- 定位修改:向 AI 描述复现步骤、实际现象、预期行为,请它只围绕这个问题修改。
- 再次验证:重跑失败的测试,并检查有没有影响其他功能。
没有发现错误时,如实记录你验证了什么即可——不需要故意制造 Bug。未测试的不标「通过」,失败的写清复现步骤和现象。
检查结果
- T01–T06 全部执行,有真实记录。
- 删除后刷新,数据不会「复活」。
- 失败项已记录复现步骤和现象。
下一节
功能齐了、测试过了,把它变成可追溯的交付:进入 C204 · 交付与复盘。
