elementui导航菜单跳转怎么设置
时间: 2023-06-26 19:09:10 浏览: 128
ElementUI之首页导航及左侧菜单(模拟实现)
你可以使用 `router-link` 来设置 `el-menu-item` 的跳转链接,示例代码如下:
```html
<template>
<div>
<el-menu :default-active="$route.path" class="el-menu-demo" mode="horizontal">
<el-menu-item index="/">首页</el-menu-item>
<el-submenu index="/components">
<template slot="title">组件</template>
<el-menu-item index="/components/button">按钮</el-menu-item>
<el-menu-item index="/components/icon">图标</el-menu-item>
</el-submenu>
<el-menu-item index="/about">关于我们</el-menu-item>
</el-menu>
</div>
</template>
<script>
export default {
name: 'NavigationMenu'
}
</script>
```
在上面的示例中,我们设置了三个 `el-menu-item` 和一个 `el-submenu`,并且使用 `index` 属性来指定跳转链接。这里我们使用了 `$route.path` 来指定当前路由的路径作为默认选中项。在实际应用中,你需要根据自己的路由配置来设置对应的链接。
阅读全文