最近看了antdesignpro關於許可權控制的官方文件以及自己框架裡許可權控制的實現，總結一下。
先貼一下官網上關於許可權控制的圖有利於理解
步驟如下:
判斷是否有accesstoken如果沒有則跳轉到登入頁面
獲取使用者資訊和擁有許可權store.dispatch('getinfo')
使用者資訊獲取成功後, 呼叫store.dispatch('generateroutes', userinfo)根據獲取到的使用者資訊構建出乙個已經過濾好許可權的路由結構(src/store/modules/permission.js)
將構建的路由結構資訊利用vue-router提供的動態增加路由方法router.addroutes加入到路由表中
加入路由表後將頁面跳轉到使用者原始要訪問的頁面,如果沒有redirect則進入預設頁面 (/dashboard/workplace)
大概思路是在使用者登陸時拿到該使用者的角色，根據角色可以知道該角色對應有哪些選單，然後通過乙個邏輯方法 將這些從資料庫拿來的選單資料進行處理(遞迴處理子選單，加入對映的元件等)，篩選並組合成router所需要的資料格式的陣列，最終在路由守衛中將這個陣列router.addroutes（）新增到路由中
其實不管是動態路由還是mock資料，最終都是處理成一樣的符合路由結構的乙個陣列後進行router.addroutes（）。
我的框架中選單的許可權實際上已經在介面中被過濾掉了，拿到的資料都是該角色有許可權的選單，下圖中的permission引數在antdvpro中指的是指令許可權，也就是action級別的許可權
action級別的許可權控制，在元件上加上v-action:[method]，即可實現自行判斷許可權
Ant Design Pro 鑑權 許可權管理
ant design pro 1.0.0 v4 最近需要專案需要用掃碼登入，因此就使用antd pro提供的鑑權能力來做 authorized.ts 提供初始化路由元件和過載路由的函式 import renderauthorize from components authorized import ...
基於Ant Design Pro2 的許可權管理實踐
在中後台管理專案中，許可權是重要的基礎功能。在專案架構初期，就要做好全面的設計。傳統的基於url控制的後端許可權，在前端spa應用的前提下，已經不再合適。服務端並不能獲取到前端的路由跳轉。許可權這快，前端的邏輯將會更重。基於ant design pro2 umi2 的技術棧前提下，antd已經提供的...
Ant Design Pro 運用點滴 4
z turn 開發過程中，有時可以使用本地mock，對於乙個喜歡使用php的我來說，就不免想跨域呼叫一下資料爽爽。但是，官方文件對此寫得不是很多。但是又不是沒寫，只要靜下心，總會找到點什麼。在and design的文件，專案實戰這一節裡，寫了這麼幾行。這個.webpackrc配置不得不讓人注意。沿著...