Vue Element ui导航栏选中高亮,刷新后选中消失
Vue Element ui导航栏选中高亮,刷新后选中消失
·
侧边菜单
导航栏选中后重新刷新页面会发现选中的导航栏高亮消失了,或者跳到了其它选项,这里的思路就是定义方法,把路由存入到sessionStorage,页面重新加载的时候从sessionStorage中获取
<!--侧边菜单-->
<el-menu :default-active="active" class="el-menu-vertical-demo" router>
<router-link to="/user" style="text-decoration: none">
<el-menu-item index="/user" v-if="isflag" @click="selectMenuItem('/user')">
<el-icon><User /></el-icon>
<span>User Information</span>
</el-menu-item>
</router-link>
<el-menu-item index="order" v-if="isflag" @click="selectMenuItem('order')">
<el-icon><Tickets /></el-icon>
<span>Order Management</span>
</el-menu-item>
<el-menu-item index="manage" v-if="userInfo.rolename=='op' ? false : true" @click="selectMenuItem('manage')">
<el-icon><Reading /></el-icon>
<span>Task Management</span>
</el-menu-item>
<el-menu-item index="task" v-if="isflag" @click="selectMenuItem('task')">
<el-icon><Calendar /></el-icon>
<span>Schedule</span>
</el-menu-item>
</el-menu>
data() {
return {
active: "/user",
};
},
mounted(){
this.active = window.sessionStorage.getItem("activerouter");
},
methods: {
selectMenuItem(path) {
this.active = path
window.sessionStorage.setItem("activerouter", path);
},
}
更多推荐
已为社区贡献11条内容
所有评论(0)