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

相关推荐
漫步人生走在路上7 分钟前
用小语种SEO突破外贸B2B天花板:法语、德语市场的实测数据
开发语言·前端·javascript·人工智能·搜索引擎·ecmascript
ydjs678899-bot2 小时前
您的Next.js中间件匹配器配置可能会跳过您认为它保护的路由
开发语言·javascript·中间件
Chengbei112 小时前
JsOwl|AI 赋能 JS 敏感信息扫描器,AST + 正则、source‑map 源码还原、登录态爬虫输出交互式 HTML 报告
开发语言·javascript·网络·人工智能·爬虫·网络安全·自动化
ShineWinsu3 小时前
对于JavaScript:初识JavaScript以及输入输出
java·开发语言·前端·javascript·css·面试·html
小白学大数据3 小时前
逆向分析短视频平台 a_bogus 参数:从 JavaScript 混淆到 Python 复现
javascript·python·音视频
donk13143 小时前
React Native for OpenHarmony 实战:三方库 react-native-circular-action-menu 的鸿蒙化适配指南
javascript·分布式·react native·react.js·wpf·harmonyos
鶴哥只手遮天3 小时前
Vue 3 核心源码深度剖析系列(v3.5.44)-第 2 章 响应式内幕(一):`effect` 与依赖追踪机制
前端·vue.js·开源
鶴哥只手遮天3 小时前
Vue 3 核心源码深度剖析系列(v3.5.44)-第 06 章 编译器内幕(二):`transform` 管线与结构指令
前端·vue.js·开源
鶴哥只手遮天3 小时前
Vue 3 核心源码深度剖析系列(v3.5.44)-第 09 章 编译器内幕(五):compiler-sfc的SFC解析与<script setup> 编译
前端·vue.js·开源
鶴哥只手遮天3 小时前
Vue 3 核心源码深度剖析系列(v3.5.44)-第 17 章 运行时内幕(五):`runtime-dom`、自定义元素与内置组件
前端·vue.js·开源