功能 bug 修复
发现问题
我们再来看一下登录之后软件的首页。
查看首页
首页呢，显示的是一个 uni-best 的默认的 UI，然后下面有一个”退出登录”的按钮。
点击”我的”呢，这个界面的话还没有去做内容。
测试退出登录
然后我们点一下”退出登录”试试。
点击之后发现没有反应，这里有个报错。
但是这个报错呢，好像也不是退出登录导致的。
查看报错信息
我们看一下这个具体的报错信息：
Cannot read properties of undefined (reading 'userInfo')意思呢是无法从 userInfo 这个变量中获取到 properties（也就是属性）。
所以呢我们这里当前用户后面是空的，也就是说，当前页面没有获取到登录的用户。
使用 AI 修复问题
描述问题给 AI
我们把这个信息呢告诉 AI，让 AI 来帮我们解决。
在 Cursor 中输入以下提示词：
当前软件完成了基础的登录功能。
登录后，首页显示当前登录的用户信息和一个退出登录的按钮。
但是控制台报错了，报错信息如下：
Cannot read properties of undefined (reading 'userInfo')
并且点击退出登录按钮，没有任何反应。然后直接回车。
查看修复结果
我们来看一下，现在呢 AI 已经帮我们修复好了问题，并且给出了原因和修复的措施。
我们来看一下右侧的界面，当前的用户呢已经是可以正常显示出来了。
验证修复
我们来点一下”退出登录”。
先清除控制台，然后刷新一下首页，这个时候没有报错了。
然后我们再点一下”退出登录”。
确定已退出登录，回到了登录页。
这样呢登录功能就已经全部完成了。
提交代码
我们现在点击右下角的”接受”。
然后点击左侧的”源代码管理器”，提交一下代码。
首先点一下项目目录右侧的加号，然后点击”提交”。
在右侧的 commit message 中，输入：
修复登录 bug然后点击”接受提交消息”，保存，然后再点击”同步更改”。
点击这个”同步更改”呢，可以把我们的提交信息推送到远程的仓库。
优化页面布局
登录功能完成之后呢，我们还有一些细节需要调整一下。
重新登录
首先我们还是先登录进去。
随便输一个手机号码，比如 13800138000，然后点击”获取验证码”。
在这里面输入验证码 628960，点击登录。
提出优化需求
首先呢我们需要将当前的用户信息以及登录按钮放到”我的”这个页面下面。
首页呢我们后面要去做业务开发，并且要清除掉这些模板自带的信息。
所以呢，我们就在这里面直接去跟 AI 讲：
首页的当前用户信息以及退出登录按钮，迁移到"我的"页面下。
清除首页的 uni-best 模板自带的信息以及用户信息和登录按钮。然后我们回车。
查看修改结果
我们来看一下 AI 给我们修改的结果。
首先我们看到主页，出现了一个”欢迎使用账号服务”的功能，原先模板自带的信息以及退出登录按钮呢都没有了。
然后再点击”我的”看一下：
- 上面呢是一个用户头像
- 下面是用户名称
这里还有点问题，显示的是”未登录”，实际上我们现在应该是一个登录的状态。
关于 UI 设计
界面的 UI 呢都是 AI 自动帮我们设计的，看起来有点丑，那是因为我们的提示词写得非常的模糊。
我们现在还没有对软件的 UI 有要求，优先完成了功能。后面我们可以再去修改软件的 UI。
修复显示问题
描述问题
我们先把这个问题给解决掉：
"我的"界面中，用户名称下面显示"未登录"，但是当前实际上是登录状态。原先手机号也没有显示，现在他直接把我们手机号也给显示了出来。
验证修复
那么现在功能呢，应该是基本上都正常了。
然后最后我们再验证一下”退出登录”。
退出登录呢，也是正常的。
提交代码
没问题之后呢，我们再点一下”接受”。
然后回到左侧的”源代码管理器”，点击右侧的加号，提交一下代码。
我们直接输入：
bug 修复然后再把它推送到远程仓库。
修复总结
本次修复的问题
| 问题 | 原因 | 解决方案 |
|---|---|---|
| 用户信息无法显示 | userInfo 未正确获取 | 修复数据获取逻辑 |
| 退出登录无反应 | 事件处理函数未正确绑定 | 修复事件绑定 |
| ”我的”页面显示”未登录” | 登录状态判断错误 | 修复状态判断逻辑 |
页面优化内容
-
首页优化
- 清除模板自带的信息
- 移除用户信息和退出登录按钮
- 添加欢迎信息
-
“我的”页面优化
- 添加用户头像显示
- 添加用户名称显示
- 添加手机号显示
- 添加退出登录按钮
Git 提交记录
# 第一次提交
git commit -m "修复登录 bug"
git push
# 第二次提交
git commit -m "bug 修复"
git push使用 AI 修复 bug 的技巧
1. 清晰描述问题
描述问题时要包含：
- 当前的功能状态
- 期望的行为
- 实际的行为
- 完整的错误信息
2. 提供错误信息
控制台报错信息：
Cannot read properties of undefined (reading 'userInfo')3. 描述复现步骤
- 登录成功后进入首页
- 首页应该显示用户信息
- 实际显示为空
- 点击退出登录无反应
4. 验证修复结果
- 检查错误是否消失
- 测试功能是否正常
- 验证边界情况
遇到问题？
如果在 bug 修复过程中遇到问题，可以扫描下方的微信二维码帮您看下（免费咨询）
下一步
bug 修复完成后，接下来我们需要：
