element侧边导航高级技巧：子菜单高亮如何让父菜单也高亮

前言

你是否曾经在使用 element 框架开发侧边导航时，遇到了子级菜单高亮后对应父级菜单未高亮的问题？本文将为你详细介绍如何解决这一问题，让你的页面交互更加流畅自然。

---

默认展示效果：子级菜单高亮，父级菜单没有高亮

---

需求效果：子级菜单同父级菜单都高亮

---

解决方案：

在对应的页面文件下面加上以下代码即可

<style  scoped>
/* 文字 */
::v-deep.el-submenu.is-active > .el-submenu__title {
  color: #409eff !important;
}
/* icon图标也跟着变 */
::v-deep .el-submenu.is-active > .el-submenu__title i {
  color: #409eff !important;
}
</style>