您现在的位置是：网站首页> 编程资料编程资料
Vue中el-menu-item实现路由跳转的完整步骤_vue.js_
2023-05-24
217人已围观
简介 Vue中el-menu-item实现路由跳转的完整步骤_vue.js_
场景：
用了element-ui的el-menu 菜单 怎样实现路由跳转呢？
方法如下：
1，在el-menu加上router，添加el-menu的default-active属性，加：动态绑定，值设置为"this.$router.path" ，
2，将el-menu-item的index设置为路由跳转path，和route.js相对应
代码：
导航一 协议退改 酒店 酒店预订 导航二
补充：el-menu-item 实现水平导航栏，路由的跳转
{{item.name}}
做了一个项目，是左侧导航树进行点击后，上方出现相应的模块，可进行跳转，而且是动态进行添加的，效果图如下：
总结
到此这篇关于Vue中el-menu-item实现路由跳转的文章就介绍到这了,更多相关Vue el-menu-item路由跳转内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持！
您可能感兴趣的文章:
相关内容
- Vue extend学习示例讲解_vue.js_
- TS 类型兼容教程示例详解_JavaScript_
- Vue实现简单弹窗效果_vue.js_
- Vue中.env、.env.development及.env.production文件说明_vue.js_
- vite + electron-builder 打包配置详解_vue.js_
- 基于Vue3实现无限滚动组件的示例代码_vue.js_
- JavaScript专题之underscore防抖实例学习_JavaScript_
- vue如何实现无缝轮播图_vue.js_
- Vue Router应用方法详解_vue.js_
- vue下的elementui轮播图自适应高度问题_vue.js_
