用Vue3+element-plus+express写个简单的后台管理框架
项目图片预览最近刚看一遍Vue3基础视频,然后就迫不及待地试了一试,也没有写多复杂,就是一个登录页和一个菜单导航的内容页;主要使用Vue3 + @vue/cli + element-plus + vue-router + axios 技术,接口调的是自己mock的数据,由于Ts还没有学习这里就用Js,这无关紧要啊,哈哈;项目gitHub地址:https://github.com/lcSuperma
项目图片预览
最近刚看一遍Vue3基础视频,然后就迫不及待地试了一试,也没有写多复杂,就是一个登录页和一个菜单导航的内容页;
主要使用Vue3 + @vue/cli + element-plus + vue-router + vuex + axios + express技术,接口调的是自己mock的以及从后面服务接口返回的数据,由于Ts还没有学习这里就用Js,这无关紧要啊,哈哈;
项目gitHub地址:https://github.com/lcSuperman/vue3-program.git
下面是项目截图:
项目代码
目前写的内容比较简单,只是一个框架而已,所以代码感觉也没有必要怎么介绍,相信用过Vue的一看就知道啦,这里就大致提一下文件夹目前存放的内容(按顺序):
- api文件夹:放的是定义的api接口函数;
- assets文件夹:基本css样式,和公共less样式,图片;
- component文件夹:vue组件;
- icon文件夹:下载到本地的阿里icon图标;
- mock文件夹:注册mock,和存放mock的数据;
- plugins文件夹:目前只放了element组件的按需引入组件;
- router文件夹:注册路由;
- utils文件夹:封装的axios和表单校验组件
- views文件夹:vue路由组件
后面的就不说啦,再说就啰嗦啦!
总结
这个项目只是我看了一遍Vue3基础视频的练手,这里只是一个简单的分享,主要是记录一下,还有如果你们也要练Vue3项目,也可以拉下来直接使用,可以节约写这些基础代码的时间;
Vue3看起来多个组合式API,写起来感觉没有Vue2一目了然,其实则不然,反而更加方便和维护,日后也必会成为国内前端市场主流框架;
接下来肯定要继续去学习和深入探索Vue3相关的技术,并把遇到的问题和主要知识点总结一下继续写成博客,大家一起讨论和学习;
更多推荐
所有评论(0)