观前提醒
在黑马程序员公众号提供的材料中就包括了前端项目,但是因为这个项目是用layui写的,已经有点过时了,所以我弄个Vue前端项目的接口调整。
上一个则只是简单跟着视频完成(因为拿到手的项目,别人都基本帮我们弄好了)。
另一个是我会选择使用Vue-admin-template
4.x版模板去快速构建该大事件后台管理项目,在构建的同时,熟悉该模板的结构与相关的知识。
Vue-admin-template
下载与调试
测试
在git Bash中选定到你需要的文件夹中运行如下的命令:
git clone https://gitee.com/panjiachen/vue-admin-template.git
下载完成后,打开VSCode进入到vue-admin-template
目录下,在终端执行如下命令,进行依赖安装和启动。
npm i
npm run dev
不用理会那些漏洞危害的报告,待程序启动成功后,通过浏览器访问地址http://127.0.0.1:9528/,将会看到下面的登录页面。
它采用的是mock文件夹的伪数据,并没有与后台真交互。
整合
接下来我参考了以下三篇博客,总算是搞清楚怎么交互了。
vue-admin-template实现登录过程(对接Controller)
SpringBoot整合vue-admin-template实现登录
基于vue-admin-template+SpringBoot+JWT实现登录