015 搭建后台管理前端
1.导入已有资源
后台项目相对复杂,我们不再从0搭建项目,而是直接使用准备好的源码。
注意:该项目的前端页面已经搭建好了。
我们解压缩,放到工作目录中:E:\javaProject\JavaEEProject
用idea打开工程即可。
初次打开的结构目录:
2.
3.运行一下看看
4.目录结构
-
index.html:html模板文件。定义了空的
div
,其id为app
。 -
main.js:实例化vue对象,并且通过id选择器绑定到index.html的div中,因此main.js的内容都将在index.html的div中显示。main.js中使用了App组件,即App.vue,也就是说index.html中最终展现的是App.vue中的内容。index.html引用它之后,就拥有了vue的内容(包括组件、样式等),所以,main.js也是webpack打包的入口。
-
index.js:定义请求路径和组件的映射关系。相当于之前的
<vue-router>
-
App.vue中也没有内容,而是定义了vue-router的锚点:
<router-view>
,我们之前讲过,vue-router路由后的组件将会在锚点展示。 -
最终结论:一切路由后的内容都将通过App.vue在index.html中显示。
-
访问流程:用户在浏览器输入路径,例如:http://localhost:9001/#/item/brand
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 智能桌面机器人:用.NET IoT库控制舵机并多方法播放表情
· Linux glibc自带哈希表的用例及性能测试
· 深入理解 Mybatis 分库分表执行原理
· 如何打造一个高并发系统?
· .NET Core GC压缩(compact_phase)底层原理浅谈
· 手把手教你在本地部署DeepSeek R1,搭建web-ui ,建议收藏!
· 新年开篇:在本地部署DeepSeek大模型实现联网增强的AI应用
· Janus Pro:DeepSeek 开源革新,多模态 AI 的未来
· 互联网不景气了那就玩玩嵌入式吧,用纯.NET开发并制作一个智能桌面机器人(三):用.NET IoT库
· 【非技术】说说2024年我都干了些啥