1.给el-menu添加 :default-active="activePath" default-active(当前激活菜单的index)
<el-menu background-color="#333744" text-color="#fff" active-text-color="#409EFF" unique-opened :collapse="isCollapse" :collapse-transition="false" router :default-active="activePath">
2.data中定义被激活的链接地址
data(){
return{
//被激活的链接地址
activePath: ''
}
}
3.点击菜单导航时,把对应的导航地址保存到sesstionStorage中
<el-menu-item :index="'/' + subItem.path" v-for="subItem in item.children" :key="subItem.id"
@click="saveNavState('/' + subItem.path)">
4.实现svaeNavState方法
// 保存连接的激活状态
saveNavState (activePath) {
window.sessionStorage.setItem('activePath', activePath)
// 重新赋值
this.activePath = activePath
}
5.在created生命周期中取出保存的链接地址
created () {
this.activePath = window.sessionStorage.getItem('activePath')
},