第二单元 本机演示:定向提交
第5课 定向提交:本机先发出
把提交做成真的:选人+文字→我发出的多一条待审核。
第一次真的「发出去」:选人、写一句、我发出的 +1。
本机路径打通的瞬间,墙就活了。
先求通,再求美、求全班。
一、这一课怎么学
- 开始前你要会:会打开浏览器,会打字。
- 怎样算做完:完成「轮到你做」,并在嵌入工具里留下可预览文件。
- 建议:先读「弄懂这件事」,再做练习。
二、学完你能做到
- 缺文字不能提交。
- 提交后列表+1。
- 能演示待审核状态。
三、弄懂这件事
这一课就这几小步:
1.成功标准
第一次真的「发出去」,成功标准要写死。
必须选了接收人,并且文字非空,才算提交成功。
缺一项就失败,并用人话提示,不要假装成功。
2.本机存储
这一课先在本机跑通主路径:选人、写一句、「我发出的」+1。
数据先存在本机即可;刷新是否还在,可在后续课加强。
先求通,再求美、求全班同一张表。
3.人话提示
失败时要用同学听得懂的话,例如「请先选接收人」。
不要甩一串英文代码或空白屏幕。
好提示也是产品的一部分,能减少误操作。
四、先跟着做
对照例子想清楚
用自己的话重述本课成功标准。
做对了会怎样你写出来的标准,别人打开页面点几下就能核对是不是做到了,而不是只有形容词。
指出哪一步必须自己点,不能听 AI 口头说完成。
做对了会怎样你明确写出:必须自己打开页面点一遍;AI 口头说「完成了」不能算数。
五、轮到你做
本机提交
写成功/失败各两条可观察标准。
做对了会怎样成功含列表+1;失败含空提交且条数不变。
做不出来怎么办成功:提交后发出列表+1、有成功提示;失败:空内容不变、超长被拦。
实现提交到「我发出的」。
做对了会怎样提交成功后,列表条数增加 1。
做不出来怎么办本机版先用数组 push 一条数据,看到列表 +1。
封存 versions/v1/。
做对了会怎样改之前留了副本,坏了还能退回。
做不出来怎么办先复制 my-wall 文件夹再改,保留能退回的副本。
用下面嵌着的氛围编程工具。写完在工具里看预览,文件是
versions/v1/index.html。做对了会怎样在嵌着的工具预览里,你能亲眼看见本课要求的按钮、分数或流程文字,而不是只有说明。
做不出来怎么办先在预览里自己点一遍;文件名必须和例子上写的完全一样,改完再刷新预览。
本节例子
工具打开时会先把上一课成果放进「代码」和「效果」。下面提示词请整段发送,在已有成果上小步改,不要整页重写。本课文件是 versions/v1/index.html。
基于点赞墙页面(代码区已是 v0 空壳),实现本机定向提交(可用 localStorage,不要真服务器): - 校验空文字:空内容要有人话提示; - 成功后「我发出的」增加一条,状态为待审核; - 失败也要有人话提示,不要只显示错误码。 做成后我要提交一条,看见列表条数 +1。不要整页推倒重来。
正在打开氛围编程工具…若长时间空白请强制刷新。
六、小心这些错
空提交也加条。
成功无列表变化。
七、带走这几句
- 先在本机把提交→可见的主路径跑通,再谈上线。
- 失败时也要给人话提示,别只丢代码号。
八、打勾再往下
- 空提交被拦住。
- 成功列表+1。
小测验
对照上面「学完你能做到」选一个答案,再点「检查」。
空文字应?
本课存储?
待审核显示在?