el-menu router 子路由的组件在父路由打开
时间: 2024-05-07 11:20:51 浏览: 49
如果你想在父路由中打开 `el-menu` 的子路由组件,你需要在子路由的组件中设置 `path` 属性,然后在父路由中使用 `component` 属性来引入这个组件。
例如,假设你有一个名为 `Submenu.vue` 的子路由组件,你可以在该组件中设置 `path` 属性:
```javascript
const routes = [
{
path: '/menu',
component: Menu,
children: [
{
path: 'submenu',
component: Submenu
}
]
}
]
```
然后在父路由中使用 `component` 属性来引入该组件:
```html
<template>
<div>
<el-menu>
<el-submenu index="1">
<template slot="title">菜单</template>
<el-menu-item index="1-1"><router-link to="/menu/submenu">子菜单</router-link></el-menu-item>
</el-submenu>
</el-menu>
<router-view></router-view>
</div>
</template>
<script>
import Submenu from './Submenu.vue'
export default {
components: {
Submenu
}
}
</script>
```
这样,当用户点击菜单中的子菜单时,`Submenu.vue` 组件将被加载到父路由的 `router-view` 中。
阅读全文