9.后台管理系统主页面布局以及左侧导航栏设计
1.首页布局 步骤：
在views目录下新建Main.vue文件，作为登录之后的布局
参考：element-ui
文章图片
使用此模块的目的是，当中间内容部分有超出时，可以固定左侧以及头部不动，中间内容进行滚动
- 代码
左侧导航栏
中间头部
内容区域
- 效果
文章图片
2.导航栏的制作
- 在
components目录下新建common目录，在该目录下新建CommonAside.vue组件
{{ item.label }}
{{ item.label }}
{{ subItem.label }}
在views目录下的Main.vue 中导入组件
代码如下
中间头部
内容区域
3.效果图 【9.后台管理系统主页面布局以及左侧导航栏设计】
文章图片
推荐阅读
- 2周刷完100道前端优质面试真题wumi
- JavaScript|什么，BOM指的是物料清单（）
- 应用数据同步自动化指导文档
- CS 120 Style and Errors
- 笔记|Vue原理深度剖析
- javascript|Vue2 原理浅谈
- 前端|深入理解vue 一些底层原理
- 前端面试总结|vue核心面试题（vue中模板编译原理）
- Vue|Vue2的核心原理剖析