4.添加导航、分栏布局，配置路由及对应页面、登陆、404

项目地址

github地址、 码云地址

路由懒加载 分栏布局

添加路由页面

首先先捋一下整体的页面结构分为三部分 1.侧边栏、2.header、3.视图区

页面结构

侧边栏的导航与页面相对应，根据导航栏新建对应页面（含登陆、404） src目录下新建views文件夹用来放视图文件

新建文件目录

新建各目录视图文件

视图文件目录

添加导航

导航页面 src/views/layout/slideBar.vue 导航栏用的是element的导航ui组建

//是否只保持一个子菜单的展开
opened: false,
//是否使用 vue-router 的模式
router: true,
//当前激活菜单的 index（导航属性）
//default-active:可以直接设置为当前路由当path

上面几个主要参数在文档中都有说明

测试导航

导航页-404