大橙子网站建设,新征程启航

为企业提供网站建设、域名注册、服务器等服务

如何使用element-ui的el-menu导航选中后刷新页面保持当前选中状态

这篇文章给大家分享的是有关如何使用element-ui的el-menu导航选中后刷新页面保持当前选中状态的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

创新互联专注于溧阳企业网站建设,成都响应式网站建设公司,购物商城网站建设。溧阳网站建设公司,为溧阳等地区提供建站服务。全流程按需求定制网站,专业设计,全程项目跟踪,创新互联专业和态度为您提供的服务

具体代码如下所示:

         
        //router当导航激活时允许以index作为路由进行页面的跳转,$route.path当前路由对象的路径,字符串,绝对路径         
        //unique-opened只允许有一个下拉菜单处于打开的状态         
        //使用default-active来实现当前菜单激活的选项
        //default-openeds当前打开的 sub-menu 的 index 的数组
首页
      
       
        导航一
       
       
        
         选项一
        
       
       
        
         选项二
        
       
      
    
mounted(){
      let path = this.$route.path;
      this.navConfig = [
        {index:'1',path:['/system/aa','/system/bb','/system/cc']},
      ];
      let thisNav = this.navConfig.find(item =>{
        return item.path.includes(path);
      });
      this.defaultOpeneds = [thisNav.index];
    }

ps:下面看下vue Element-ui el-menu 左侧导航条


 0&&child.level==2" :key="child.id" :index="child.linkname">
 {{child.linkname}}
 
 {{three.linkname}}
 
 
 
 
 {{child.linkname}}
 
 
 
 
 
 {{item.linkname}}
 
 
 

感谢各位的阅读!关于“如何使用element-ui的el-menu导航选中后刷新页面保持当前选中状态”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!


名称栏目:如何使用element-ui的el-menu导航选中后刷新页面保持当前选中状态
网站地址:http://dzwzjz.com/article/pcddjp.html

其他资讯

在线咨询
服务热线
服务热线:028-86922220
TOP