Vue許可權管理

2021-09-02 02:03:51 字數 1149 閱讀 8063

博主最近剛剛上手乙個圖書管理系統的小demo,在編寫的過程中遇到了許多的問題,尤其是對於我這樣的新手來說許可權管理是乙個難點,本身對vue就不是很理解,所以查閱了許多的文章後才有一點點思路,所以在這裡記錄下來,也希望其他的小白也能夠少走一些彎路。

我大概的思路是這樣的

首先,我們我們有兩種使用者,乙個admin(管理員),乙個user(普通使用者),他們所看到的介面都是不一樣的

第一步:我們將一些公用的元件提取出來製作成乙個靜態路由表,其他需要有許可權的展示的元件我們把他製作成動態的路由表

第二步:當我們登入的時候獲取使用者的身份,然後我們遍歷動態路由表,動態的生成路由表

是不是這樣就感覺簡單很多了呢,下面我們來建立乙個乙個簡單的demo吧!先看一下我的結構圖

error------錯誤元件(當路徑錯誤時顯示)

login------登入元件

home------普通使用者介面

home--------管理員介面

import vue from 'vue'

import router from 'vue-router'

vue.use(router)

const router = new router(,

,]})

export default router;//我們把靜態的路由表匯出去

//我們使用meta標籤來定義裡面的許可權

最後就是我們的login元件了

vue 許可權管理

今天來說說許可權管理,因為網上已經有很多關於這方面的很多內容,博主也是借鑑了網上的一些邏輯來寫的,主要也是說說前端實現許可權管理的乙個思路,也是作為自己日後面對這樣的問題的乙個解決方案。首先需要了解的就是純前端是無法實現許可權管理的,vue的許可權管理主要是基於路由實現的,當然這樣的許可權管理完全可...

Vue後台許可權管理

許可權是對特定資源的訪問許可,所謂許可權控制,也就是確保使用者只能訪問被分配的資源 而前端許可權總的來說是請求許可權 請求的發起可能有下面兩種形式觸發 總的來說 所有的請求發起都觸發自前端路由或試圖 所以我們可以從這兩個方面入手 對觸發許可權的源頭進行控制 最終要實現目標是 前端許可權控制可以分為 ...

vue 需求 許可權管理

1 全域性註冊元件 vue.directive arrowbtn 使用自定義指令 編輯 獲取角色擁有的頁面許可權 const await store.dispatch user getinfo 篩選有顯示許可權的頁面 const filterroutes asyncroutes.filter ite...