el-menu 我是希望点击菜单的时候按照路由中的路径来跳转,而不是按照index跳转
时间: 2024-04-15 11:28:01 浏览: 70
如果你希望在 `el-menu` 组件中点击菜单时根据路由的路径进行跳转,而不是按照索引来跳转,你可以使用 `router-link` 的方式来实现。
首先,确保你已经正确设置了路由配置和组件的路径。然后,使用 `router-link` 替代 `el-menu-item` 组件,并将 `to` 属性设置为对应的路由路径。这样当你点击菜单时,就会根据路由的路径进行跳转。
以下是一个示例代码:
```html
<el-menu>
<router-link to="/" exact>
<el-menu-item>Home</el-menu-item>
</router-link>
<router-link to="/category">
<el-menu-item>Category Management</el-menu-item>
</router-link>
<router-link to="/about">
<el-menu-item>About</el-menu-item>
</router-link>
<router-link to="/login">
<el-menu-item>Login</el-menu-item>
</router-link>
<router-link to="/register">
<el-menu-item>Register</el-menu-item>
</router-link>
</el-menu>
```
在这个示例中,我们使用 `router-link` 包裹了每个菜单项,并将 `to` 属性设置为对应的路由路径。这样当用户点击菜单时,就会根据路由的路径进行跳转。
请确保你已正确导入和使用了 Vue Router,并且将 `router-link` 包裹在 `el-menu` 组件中。
希望这次的回答能满足你的要求。如果还有其他问题,请随时提问。
阅读全文