写的比较乱,方便以后自己来复制
background-color="#545c64"
text-color="#fff"
active-text-color="#ffd04b"
router
>
element ui 导航跳转页面
:default-active="" 默认显示页面 @select 点击导航的回调 router路由模式 官网是这样解释的
处理中心
我的工作台
选项1
选项2
选项3
选项4
选项1
选项2
选项3
只有再el-menu中设置这个才能以index来跳转 这个是基于element的比较简单的跳转方式了,还有别的就是通过把页面注册成组件来进行跳转的,或者是用router-link 中的
to 里面设置跳转路径
index.js中设置子路由
export default new Router({
mode:'history',//设置之后地址栏会去掉 # 号
routes: [
{
path:'/',
name:'login',
component: resolve => require(['../views/login'],resolve),
},
{
path:'/pageHome',
name:'pageHome',
component: resolve => require(['../views/pageHome'],resolve),
children:[
{
path:'/',//默认跳转路径
name:'HardwareMonitor',
component: resolve => require(['../views/HardwareMonitor'],resolve),
meta: {requireAuth: true},
},
{
path:'/pageHome/HardwareMonitor',
name:'HardwareMonitor',
component: resolve => require(['../views/HardwareMonitor'],resolve),
meta: {requireAuth: true},
},
{
path:'/pageHome/HardwareMonitor1',
name:'HardwareMonitor1',
component: resolve => require(['../views/HardwareMonitor1'],resolve),
meta: {requireAuth: true},
}
]
},
]
})
至于为什么再app.vue中设置了router-view 然后又在首页里面设置router-view 他是怎么选择跳转的,大致百度了下,说是通过children先到app再到首页,对不对咱现
在也不知到,毕竟不是专业前端。。。。先会用,至于理解透彻,以后再说吧