vue element-ui 左侧菜单栏 el-menu属性实现动态菜单

原文网址:https://www.cnblogs.com/wasbg/p/12696303.html

vue element-ui 左侧菜单栏 el-menu属性实现动态菜单

基于renren-fast开源项目

下边的四个标签使我们常用的,列出来以示区分

在<el-menu>中需要--:default-active="this.$route.path"。用来绑定路由表

在<el-menu>中需要--router------或者router=true

在<el-submenu>中的index不可缺少,为必须值,不过此处的index仅为索引,用来让当前元素下的子菜单收缩或释放。每一个submenu的index值只要不一样便可

在<el-menu-item>中,index的值不可缺少,就是用这个来进行路由跳转,index的值为跳转的路径

以下是当时测试的时候写的例子(aaa, bb啥的别介意哈 ,)

<pre style="margin: 0px; padding: 0px; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;">main-sidebar.vue</pre>

image

保证打开的tab标签不是同一个页面打开

image
image
image
image

<pre style="margin: 0px; padding: 0px; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;">router/index.js</pre>

image

努力到无能为力,拼搏到感动自己。 欢迎大家在下方多多评论。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容