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 会先更新自己的内部激活状态。

相关推荐
Tanjia_kiki3 小时前
谷歌浏览器中F12编辑并重发请求
开发语言·前端·javascript
honkun63 小时前
vue 表格组件 vxe-table 实现拖拽列字段自动生成透视表汇总
前端·javascript·vue.js
IMPYLH4 小时前
HTML 的 <p> 元素
前端·javascript·html
leoZ2314 小时前
第 4 篇:布局骨架——页面壳、栅格、卡片
前端·javascript·vue.js·opencv·计算机视觉·数据挖掘·语音识别
何以解忧,唯有..4 小时前
Vue 3 模板语法详解:从插值到指令的完整指南
前端·javascript·vue.js
EasyGBS4 小时前
从接入到稳定播放:无插件直播H5视频流媒体播放器EasyPlayer.js如何撑起Web端流媒体
开发语言·前端·javascript
Carl_奕然4 小时前
【智能体】Agent的四种设计模式之:React(2026最新版)
javascript·人工智能·python·react.js·设计模式·语言模型
名为沙丁鱼的猫7294 小时前
React/JSX 编码规范
前端·javascript·react.js