实现倒计时

本节目标

让页面上的 25:00 真正开始倒计时，点击后数字会一秒一秒地减少。由于AI每次的发挥不同，所以最终的代码可能不同，很可能上节课已经实现了这个功能。

告诉 AI 你要什么

在 Cursor 的聊天面板中输入：

让这个番茄时钟的倒计时功能运行起来。打开页面后，点击时间数字就开始倒计时，每秒减少 1 秒，从 25:00 倒数到 00:00。

看看效果

AI 会修改你的代码，加入计时的逻辑。点击"Accept"接受更改后，刷新浏览器页面。

现在点击时间数字，你应该能看到它开始倒计时了：

• 25:00 → 24:59 → 24:58 → ...

如果倒计时没有生效

回到 Cursor，告诉 AI：

我刷新了页面，但是点击数字后倒计时没有开始，请帮我检查一下

AI 会检查代码并修复问题。这就是 Vibe Coding 解决问题的方式——直接描述你看到的现象，让 AI 帮你排查。

你不需要知道是什么"bug"，也不需要看懂代码。你只需要准确描述"我做了什么操作"和"我看到了什么结果"。

常见问题

倒计时走得不准（快了或慢了）

告诉 AI：

倒计时的速度好像不准，能不能确保它严格每秒减少 1 秒？

倒数到 00:00 后继续减成负数

告诉 AI：

倒计时到 00:00 之后还在继续减，变成了负数，请让它在 00:00 时自动停止

页面刷新后倒计时重新开始

这是正常的。因为我们目前没有保存状态的功能，刷新页面就会回到初始状态。不需要修复。

下一步

倒计时已经能跑了，但现在只能点一下开始，没法暂停和重置。下一节我们来加控制按钮。