1.导航数据写死版(即导航的内容不需要通过请求获得):
刚开始我是这样用的(能用但是有点问题):
<el-menu-item-group>
<template slot="title">分组一</template>
<el-menu-item index="1-1">
<router-link to="/qe">富文本测试页</router-link>
</el-menu-item>
<el-menu-item index="1-2">
<router-link to="/vca">页面截图测试页</router-link>
</el-menu-item>
</el-menu-item-group>
这样用的话点击 router-link 渲染出来的a标签是可以正常跳转的,但是点击 el-menu-item 渲染出来的li标签就无法跳转了
其实人家组件本来就可以和vue-router配合得很好:
<el-menu default-active="2" class="el-menu-vertical-demo" router>
<!-------------------------------------------------------------------------------------------------------->
<el-menu-item-group>
<template slot="title">分组一</template>
<el-menu-item index="/qe">富文本测试页</el-menu-item>
<el-menu-item index="/vca">页面截图测试页</el-menu-item>
</el-menu-item-group>
修改了两处:
1.顶级父元素增加 router 属性(这里不能写成router="true",否则会报错Invalid prop: type check failed for prop “router”. Expected Boolean, got String with value “true”.)
2.选项子元素的跳转路径写在 index 属性里
1.导航数据请求获取版:
留个坑慢填