正常情况刷新后选中菜单会失去选中的状态,需要把default-active 当前激活菜单的 index保存下来这样刷新后读取
methods方法中增加
getSess() {
this.active = window.sessionStorage.getItem("active");
},
setSess(val) {
window.sessionStorage.setItem("active", val);
},
然后再created方法中每次创建后读取
this.getSess();
在子菜单中增加点击事件 <el-menu-item :index="'/' + subItem.path" v-for="subItem in item.children" :key="subItem.id" @click="setSess('/' + subItem.path)" 这里增加因为默认按id跳转所以保存路径 > <i class="el-icon-menu"></i> <span slot="title">{{ subItem.authName }}</span> </el-menu-item>
这样刷新后就可以每次读取选中的状态了,使用sessionStorage的原因是在关闭窗口或标签页之后将会删除这些数据。
提示: 如果你想在浏览器窗口关闭后还保留数据,可以使用 localStorage 属性, 该数据对象没有过期时间,今天、下周、明年都能用,除非你手动去删除。