Vue3Button组件练手项目
Vue3 的按钮组件项目，挺适合用来练手的。用的是最新的 Vue 3，还有开发效率比较高的 Vite，再加上 Element Plus 这个 UI 库，基本就是现在 Vue 项目的主流组合了。项目结构清爽，逻辑也简单，适合用来熟悉 Composition API 的写法和一些 Vue3 的新特性。
项目用的是Composition API，代码更清晰，像ref、reactive、computed这些概念都会用到。适合你刚从 Vue2 过渡过来，还不太熟的新语法。像setup()函数怎么写、怎么组织逻辑，看这个项目就挺有感觉。
Vite真的是快，响应也快，热更新也快，项目一跑起来就能感觉到和 Webpack 不一样。vite.config.js配置也挺直观的，适合当模板用。如果你以后项目多了，直接拿这个改改就行。
Element Plus用起来和 Element UI 差不多，但更适配 Vue3。像type、icon这些，搭配起来功能也蛮多。按钮的样式还能自定义，适合做实际项目的样式调整。
项目里还顺带加了Teleport、Suspense这些 Vue3 的新东西，用得不多但你能知道怎么回事。像把弹窗渲染到页面其他地方这种场景，用
另外如果你对TypeScript感兴趣，这项目也有用到，可以看看props和emit怎么定义类型。还有ESLint和Prettier，项目风格统一，全靠它们，写久了也能养成好习惯。
如果你刚开始学 Vue3，或者想找个靠谱的项目来试试 Vite 和 Element Plus 的配合，那这个vue3-button.zip还挺值得一看。顺便多练练setup和ref，对你以后写复杂组件也有。
文件大小：29.18KB
评论区