登入的角色本身屬于領導級別（集團權限），沒有下級的不同權限：
切換不同身份（公司），以獲得相應部門的不同導航菜單及權限
這里實現(xiàn)：更改角色權限后，實現(xiàn)頁面 不刷新 更改其展示出來的 導航菜單
1、在右上角頁面代碼內，通過后端接口獲取子角色（公司）的對應菜單路由（圖2中data）
2、將路由數(shù)據(jù)和自身代碼寫入方式一樣，寫入store存儲路由數(shù)據(jù)（參考自己代碼首次獲取路由后存儲數(shù)據(jù)的方法）
3、通過事件總線$eventBus監(jiān)聽頁面路由替換導航
4、清空、重新添加路由$router.addRoutes文章來源：http://www.zghlxwxcb.cn/news/detail-671888.html
導航組件里監(jiān)聽并操作：
代碼片：文章來源地址http://www.zghlxwxcb.cn/news/detail-671888.html
async toMenuChange(id) {
//...省略前面非必要 此處調用自己的接口
await getMenuListChange().then((mresult) => {
// console.log('得到新路由列表：' , mresult);
// 對數(shù)據(jù)進行改造：
const sdata = JSON.parse(JSON.stringify(mresult.data));
const rdata = JSON.parse(JSON.stringify(mresult.data));
const sidebarRoutes = this.filterAsyncRouter(sdata);
const rewriteRoutes = this.filterAsyncRouter(rdata, false, true);
rewriteRoutes.push({ path: "*", redirect: "/404", hidden: true });
store.commit("SET_ROUTES", rewriteRoutes);
store.commit(
"SET_SIDEBAR_ROUTERS",
constantRoutes.concat(sidebarRoutes)
);
store.commit("SET_DEFAULT_ROUTES", sidebarRoutes);
store.commit("SET_TOPBAR_ROUTES", sidebarRoutes);
// 在事件總線中發(fā)布事件 this.$bus.$emit('xxx','傳遞參數(shù)')
this.$eventBus.$emit("changeTopBar");
// 重置導航
resetRouter();
this.$router.addRoutes(sidebarRoutes);
});
}
this.$eventBus.$on("changeTopBar", () => {
// ...
});
this.$eventBus.$off(["changeTopBar"]);
到了這里，關于【vue】更改角色權限后，實現(xiàn)頁面不刷新更改其可展示的導航菜單的文章就介紹完了。如果您還想了解更多內容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持TOY模板網(wǎng)！
