vue采用vue-element-admin框架,左侧一级菜单是框架自带的,在一级菜单右侧需要做一个二级菜单,使用组件el-menu需要实现路由跳转。百度了很多,就是没解决问题。经过读文档+尝试,发现两种方法可以实现跳转
第一种,最简单的在el-menu标签上增加router属性就可以,不用谢其他的方法,是最方便的
<el-menu class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" :router="true" default-openeds="['team','certification']" v-for="item in menu"> <el-submenu :index="item.path" v-if="item.children"> <template slot="title"> <span>{{item.name}}</span> </template> <el-menu-item v-for="subitem in item.children" :index="subitem.path">{{ subitem.name }}</el-menu-item> </el-submenu> <el-menu-item :index="item.path" v-else> <span slot="title">{{item.name}}</span> </el-menu-item> </el-menu>第二种办法,习惯的思维就是点击后使用this.$router.push()跳转
handleSelect(key, keyPath) { this.$router.push({ path: key, params: {data: 'query' } }) }问题解决。