側(cè)邊菜單
導(dǎo)航欄選中后重新刷新頁(yè)面會(huì)發(fā)現(xiàn)選中的導(dǎo)航欄高亮消失了,或者跳到了其它選項(xiàng),這里的思路就是定義方法,把路由存入到sessionStorage,頁(yè)面重新加載的時(shí)候從sessionStorage中獲取文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-614036.html
<!--側(cè)邊菜單-->
<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);
},
}
文章來(lái)源:http://www.zghlxwxcb.cn/news/detail-614036.html
到了這里,關(guān)于Vue Element ui導(dǎo)航欄選中高亮,刷新后選中消失的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!