需求：

現(xiàn)有一個(gè)后臺(tái)管理系統(tǒng)，涉及到用戶權(quán)限菜單的問題，即不同的用戶登錄，根據(jù)權(quán)限的不同展示不同的菜單。

回答：

實(shí)現(xiàn)思路

第一種方法：動(dòng)態(tài)添加路由，將完整路由整合到一起，并從路由表中提取出菜單；
1、先將不需要權(quán)限（靜態(tài)）的頁面先掛載到new Router路由實(shí)例上，并export出去。
2、當(dāng)用戶登錄后，獲取用戶的權(quán)限信息，然后根據(jù)用戶的權(quán)限（role或某個(gè)標(biāo)識(shí)）調(diào)后端接口取到路由表。
3、調(diào)用router.addRoutes(store.getters.addRouters)添加用戶可訪問的路由（注意：這里有個(gè)hack方法? next({ ...to, replace:true}) // hack方法 確保addRoutes已完成 ,setthe replace:trueso the navigation will not leave ahistoryrecord })
4、將所有的路由表存到根標(biāo)簽內(nèi)（也有將路由表存到vuex里，根據(jù)vuex中的路由表來渲染菜單）

第二種方法：將路由和菜單分開，前端完全控制路由，菜單從后端獲取。
1、前端控制整個(gè)系統(tǒng)的完整路由，自行進(jìn)行增減路由表。
2、根據(jù)用戶權(quán)限調(diào)后端接口獲取可訪問的菜單列表，并根據(jù)數(shù)據(jù)規(guī)則進(jìn)行重組。
3、將獲取的菜單數(shù)據(jù)列表Array綁定到菜單SideBar上，渲染側(cè)邊欄組件 。

值得說明的是，這些頁面級(jí)別的權(quán)限控制，雖然已經(jīng)在前端做了，但是只在前端做是不夠的，后端也依然要做接口層面的權(quán)限控制。