<el-menu :default-active=‘$route.path‘ :router=‘true‘ :unique-opened=‘true‘ :default-openeds="defaultOpeneds" 
        background-color="#bd1e22" text-color="#fff" active-text-color="#ffd04b">         
        //router当导航激活时允许以index作为路由进行页面的跳转,$route.path当前路由对象的路径,字符串,绝对路径         
        //unique-opened只允许有一个下拉菜单处于打开的状态         
        //使用default-active来实现当前菜单激活的选项
        //default-openeds当前打开的 sub-menu 的 index 的数组
<el-menu-item index=‘/home‘>首页</el-menu-item>
<el-submenu>
<template slot="title">
<i class=‘‘></i><span>导航一</span>
</template>
<el-menu-item index=‘/first/page1‘>
<template slot="title">
<i class=‘‘></i><span>选项一</span>
</template>
</el-menu-item>
<el-menu-item index=‘/first/page2‘>
<template slot="title">
<i class=‘‘></i><span>选项二</span>
</template>
</el-menu-item>
</el-submenu>
</el-menu
>
     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];
}

使用element-ui的el-menu导航选中后刷新页面保持当前选中的更多相关文章

  1. elementUI的导航栏在刷新页面的时候选中状态消失的解决

    首先elementUI的导航栏中的选中项的高亮显示时的字体颜色可以在属性中设置,但是高亮时的背景颜色不能设置,所以要自己修改高亮的背景颜色 .el-menu-item.is-active { back ...

  2. element ui 渲染超过上百条数据时页面卡顿,更流畅的加载大量数据

    问题:element ui table渲染上百条数据,页面渲染开始出现延时 解决方案:使用pl-table 注意:设置use-virtual并给定table高度

  3. element ui aside — 侧栏导航菜单移入移出折叠效果

    效果如图,移入移出控制折叠,点击按钮后移入移出不可控制折叠. 功能是很简单的功能,不过昨天这块还是弄了小一个小时,所以记录下来. 发现的问题: 模版上el-aside写上@mouseenter无效 解 ...

  4. Vue ElementUI主页面搭建和导航栏使用,并在刷新页面的时候选中状态消失的问题解决

    <template> <div style="height:100%;width: 100%; padding:0 auto; margin: 0 auto;"& ...

  5. element ui的表格列设置fixed后做动态表格出现表格错乱

    最近使用element-UI时,使用table做动态表格,当操作列使用fixed时,动态切换表格列设置设置时就会出现错乱,情况如下: 解决方法: 把el-table-column上的key设成一个随机 ...

  6. Element UI - 打开弹出框(el-dialog)页面会抖动

    当 dialog 出现时,页面右边缩小了 5px,模态框看起来会抖动 解决方案 发现 body 多了样式:padding-right: 5px 和 overflow: hidden.紧接着我就在全局设 ...

  7. iView中Tree组件children中动态checked选中后取消勾选再选中无效问题

    如题,我有一个Tree组件,动态更新check选中子级列表的时候,取消勾选了再点击选中时复选框样式不是勾选状态,但是数据已经有了. 对此解决方案是:将初始化时Tree组件data数据深拷贝一遍再去判断 ...

  8. cell选中后进入重用池出来选中状态消失

    #import "XXViewController.h" @interface XXViewController ()<UITableViewDelegate,UITable ...

  9. element ui 表格提交时获取所有选中的checkbox的数据

    <el-table ref="multipleTable" :data="appList" @selection-change="changeF ...

随机推荐

  1. HBuildX报错此插件的使用依赖于外部应用程序eslint,本机未检测到此应用

    最近刚刚开始用HBuildX,结果保存时报错 解决方案: 打开HBuilderX 打开plugins 打开eslint-vue, 然后Git Bash Here,npm install 重新安装一下 ...

  2. 工作笔记 之 Linux服务搭建

    No.1 linux环境下安装nginx步骤 Nginx (engine x) 是一款轻量级的Web 服务器.反向代理服务器.电子邮件(IMAP/POP3)代理服务器,在BSD-like 协议下发行. ...

  3. css样式优先级计算规则

    css样式的优先级分为引入优先级和声明优先级. 引入优先级 引入样式一般分为外部样式,内部样式,内联样式. 外部样式:使用link引入的外部css文件. 内部样式:使用style标签书写的css样式. ...

  4. python爬虫执行js代码-execjs

    一.安装模块 pip install PyExecJS execjs会自动使用当前电脑上的运行时环境(建议用nodejs,与Phantomjs) 二.简单的使用 import execjs js_ob ...

  5. Java生鲜电商平台-电商数据运营统计与分析

    Java生鲜电商平台-电商数据运营统计与分析 今天分享将会分为以下几个方面来阐述: 1. 作为运营我们需要统计与分析的几个核心数据是什么? 2. 核心数据对业务的指导价值在哪里呢? 3. 作为产品PM ...

  6. 使用vue在开发中的一些小问题--利用环境变量做一些常量的定义

    1.集中式的环境配置: (1)使用vue-cli基本上不用去处理什么,只需要在config文件夹下的文件中配置写既可: module.exports = merge(prodEnv, { NODE_E ...

  7. wireshark和tcpdump抓包TCP乱序和重传怎么办?PCAP TCP排序工具分享

    点击上方↑↑↑蓝字[协议分析与还原]关注我们 " 介绍TCP排序方法,分享一个Windows版的TCP排序工具." 在分析协议的过程中,不可避免地需要抓包. 无论抓包条件如何优越, ...

  8. docker tomcat8 mysql8部署常见错误

    出现docker: out of memory bug ,内存溢出 解决方法: free -mh 应该看一下内存 内存优化/买内存 出现java.util.zip.ZipException: erro ...

  9. angularjs $http请求网络数据并展示

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. Hadoop HA 架构

    为什么要用集群? 企业里面,多台机器 伪分布式 每一个角色都是一个进程 HDFS: NN SNN DN YARN: RM NM 大数据所有组件, 都是主从架构 master-slave HDFS读写请 ...