el-menu子菜单点击就被激活,恢复之前的激活状态

html 复制代码
<el-menu
	ref="menu"
    mode="vertical"
   	text-color="#fff"
    background-color="#1f3b4a"
    :default-active="activeMenu"
    @select="handleClick"
    :collapse="isCollapse"
>

最近遇到的问题是:其中有一个子菜单1点击会打开新页面,但是菜单激活状态也变成了子菜单1,当前页面还是子菜单2的页面和路由,怎么恢复菜单激活状态为子菜单2??

javascript 复制代码
handleClick(index) {
	// 在打开新页面后加上代码
	// 恢复当前菜单激活状态
	setTimeout(() => {
			this.$refs.menu.updateActiveIndex(this.activeMenu)
			// 或者 this.$refs.menu.activeIndex = this.activeMenu;
	}, 200)
}

原因分析:default-active 只是菜单的默认激活项,点击菜单时,el-menu 会先更新自己的内部激活状态。

相关推荐
A黄俊辉A3 天前
uniapp webview中实现 app和内嵌的H5双向通信
vue.js·json
三十而立洋3 天前
Cookie 详解:从产生到安全,一次讲透
前端·javascript
卡布鲁3 天前
把一个 Vite + Vue3 应用塞进 qiankun (React + Umi3) 主站:十个坑的复盘
前端·javascript·react.js
李少兄3 天前
JavaScript 隐式全局变量解析
javascript
honkun63 天前
vue 表格组件 vxe-table 配置 ajax 请求自动加载数据与表单查询
vue.js·vxe-table
kybs19913 天前
全球灾害数据分析可视化 毕业设计-附源码66794
vue.js·spring boot·mysql·安全·django·c#·asp.net
雪芽蓝域zzs3 天前
第26章:ECharts 自定义主题 + 页面一键切换主题(深色 / 浅色两套)
vue.js·echars
雪芽蓝域zzs3 天前
第22章:ECharts 图表联动(多图表交互联动)
vue.js·echars
daols883 天前
vue 表格组件 vxe-table 实现虚拟滚动与无需滚动加载
vue.js·vxe-table
雪芽蓝域zzs3 天前
第18章:ECharts 折线图 + 标记点、标记线,自定义 tooltip
vue.js·echars