告别繁琐开发！CodeBuddy - 程序员的效率倍增神器（三）

“我正在参加CodeBuddy「首席试玩官」内容创作大赛，本文所使用的 CodeBuddy 免费下载链接：腾讯云代码助手 CodeBuddy - AI 时代的智能编程伙伴”；

前言

通过 告别繁琐开发！CodeBuddy - 程序员的效率倍增神器（一） 和 告别繁琐开发！CodeBuddy - 程序员的效率倍增神器（二） 两篇文章的学习， 我们终于通过 CodeBuddy 完成了电子相册的基础内容的开发, 本篇中，我们将继续完善我们的项目， 添加一些新的功能。

添加画廊功能

提出的prompt 如下:

为该项目添加一个画廊的功能 , 要求如下:1.需要新建一个路由, 在新的页面中展示画廊内容.

首页中添加新的跳转链接可以跳转到画廊的页面 画廊中的图片采用网络中开访问的图片地址

如下图所示，我们跟着CodeBuddy的提示来完成画廊的开发

问题修复

在跟着提示修改代码的过程中，发现的问题是，部分代码给出的提示，会覆盖原有的功能，这是个需要注意的地方， 如下图所示：

很明显 HomeView.vue 如果按照提示进行修改会覆盖原有的功能， 同时通查看 在App.vue文件的修改也会导致项目出现问题，此时我的处理办法如下。

选择HomeView.vue 和 App.vue 两个文件 ，同时提问 ：

结合上面内容的回答重新 修改这两个文件的内容, 要求要保持原本的内容不变

然后根据新的提示内容进行修改即可

完整项目展示

导航修改

画廊内容

但是此时的画廊布局并不符合我的审美， 此时选择 画廊的文件并进行提问

接下来看效果

在布局中 体现出了三种风格， 还是不错的

总结

关于电子相册的开发本章节也是最后一个部分了， 该项目可以说是完全没有敲过一行代码，但是项目并不重要， 重要的是如和去使用 CodeBuddy 来辅助我们进行开发。好了，下课！！！