侧边菜单
导航栏选中后重新刷新页面会发现选中的导航栏高亮消失了,或者跳到了其它选项,这里的思路就是定义方法,把路由存入到sessionStorage,页面重新加载的时候从sessionStorage中获取文章来源地址https://www.toymoban.com/news/detail-614036.html
<!--侧边菜单-->
<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);
},
}
文章来源:https://www.toymoban.com/news/detail-614036.html
到了这里,关于Vue Element ui导航栏选中高亮,刷新后选中消失的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!