在路由裡面新增識別符號 isadmin: true,
和伺服器返回是否是管理員
聯合判斷
//看vuex裡面的使用者資訊，是否是管理員，是管理員就全部是true
//不是管理員，看當前路由資訊，的meta標籤 判斷是否是管理員
//是就顯示，不是就不顯示
-main
:style=""
v-show="
this.$store.state.user.user.isadmin || !this.$route.meta.isadmin
">
-view>
login 元件
登入成功後做本地儲存和store儲存，並進行跳轉。
async handlelogin(e);/
/傳送登入非同步請求，獲取結果集
/code=='0'表示登入成功，進行本地儲存和store儲存 並進行跳轉。
//else 彈出錯誤提示
if(code == "0"
)else);
toast.show();
}}
router.beforeeach做個全域性路由守衛，
根據是否需要鑑權以及是否已經登入來進行不同操作。
axios.interceptors.request.use攔截axios所有http請求，
如果存在token，則放入請求頭。
axios.interceptors.response.use
攔截的axios的響應，如果token以及失效，
則清除本地快取和store儲存並跳轉到登入頁面。
/
/ 攔截axios所有http請求，預先放入token請求頭
axios.interceptors.request.use(config =>
return config;})
;// 響應***，提前預處理響應
axios.interceptors.response.use(
response =>
}return response;},
err => })
;function logoutfun()}
);}
import axios from
"axios"
;import store from
"./store"
;import router from
"./router";
(req, res, next) =>
else
}else
})
Vue路由鑑權
router index.js var router export default router newrouter 更多.let indexscrolltop 0router.beforeeach to,from next else else else if to.path document.ti...
vue 按鈕許可權 鑑權
在實際專案開發中，登陸的賬號會有多種角色，例如操作員新增，審核員審批。每個角色的按鈕許可權都不相同，我們在開發中應該做好這一塊的許可權處理 首先使用者登入時，我們可以用過api介面獲取所有選單和按鈕的許可權,我們可以把所有按鈕資訊，儲存在sessionstorage中。const authority...
Ant Design Pro 鑑權 許可權管理
ant design pro 1.0.0 v4 最近需要專案需要用掃碼登入，因此就使用antd pro提供的鑑權能力來做 authorized.ts 提供初始化路由元件和過載路由的函式 import renderauthorize from components authorized import ...