国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

針對Vue的后臺權(quán)限功能實現(xiàn)思路(持續(xù)更新)

anRui / 1319人閱讀

摘要:最終給前端返回的數(shù)據(jù)格式如下賽冷思內(nèi)容管理其他字段文章管理文章列表文章詳情隨筆管理添加修改隨筆大致思路就是這樣,回頭在實現(xiàn)的過程中發(fā)現(xiàn)不完善的,將會持續(xù)更新。最新更新在我的博客

權(quán)限是一塊設計挺繁瑣的功能,尤其是設計到前端SPA應用,前后端的耦合性太強,先屢屢思路,再實現(xiàn),如果您有好的建議,也可評論留言。

基本的表結(jié)構(gòu)如下 用戶表。user
字段 說明
id 用戶ID
username 用戶名
示例
id username
1 賽冷思

原文在我博客


前端路由表。routes
字段 說明
id 路由自增ID
pid 父級路由ID,默認根路由為0
path 方便操作無線分類的關(guān)鍵字段,后面再說
web_pata 前端路由路徑,注意:為方便各種SPA,前后不帶斜杠,交給前端自己處理即可
name 路由名稱
desc 路由描述
sort 排序,例如同一級路由,可按此字段排序,這個排序結(jié)果將會在前端菜單中提現(xiàn)
extra 拓展信息,格式為JSON字符串,例如vue-router中的meta信息
有幾項需要注意:

添加功能盡量讓前端開發(fā)者填寫,你懂得

修改時,前端一定要知道,你懂得

刪除時,前端一定要知道,你懂得

切記,這些東西都是跟前端相關(guān)聯(lián)。。。

示例
id pid path web_path name desc sort extra
1 0 0, manager 內(nèi)容管理 管理內(nèi)容的路由 1 {}
2 1 0,1, article 文章管理 文章管理 1 {}
3 2 0,1,2, list 文章列表 查看文章列表頁面 1 {}
4 2 0,1,2, view 文章詳情 查看文章詳情頁面 1 {}
5 2 0,1,2, edit 添加/修改文章 添加和修改文章公用頁面 1 {"test":"article-edit"}
6 1 0,1, mind 隨筆管理 隨筆管理 1 {}
7 6 0,1,6, list 隨筆列表 查看隨筆列表頁面 1 {}
8 6 0,1,6, view 隨筆詳情 查看隨筆詳情頁面 1 {}
9 6 0,1,6, edit 添加/修改隨筆 添加和修改隨筆公用頁面 1 {"test":"mind-edit"}

注意:給用戶選擇路由時,如果選擇的是最底層的路由,那么從它自身到最頂層父級,都應該被選擇,例如選擇文章列表,那么文章管理和內(nèi)容管理都應該被選中。同樣,如果選擇的不是最底層的,那么所有的子級應該被選中,不再細說。

解釋一下關(guān)鍵字段

pid 父級ID,根級ID為0,沒啥說

path 默認為"0,",意思就把當前數(shù)據(jù),從最頂層的父級pid到自身的pid,用英文","鏈接起來,最后要加個逗號

例如,文章管理自己的pid為1,它得父級內(nèi)容管理的pid是0,所以文章管理的path就是"0,1,",一次類推就行

extra 前端路由的拓展信息


用戶路由關(guān)聯(lián)表。user_routes
字段 說明
id 自身自增ID
user_id 用戶ID
route_id 路由ID
extra 拓展信息,格式為JSON字符串,例如vue-router中的meta信息,此拓展在將會和routes表extra合并,可以通過這個字段細粒度控制路由中的小操作
示例
id user_id route_id extra
1 1 1 {}
2 1 2 {}
3 1 6 {}
4 1 3 {}
5 1 4 {}
6 1 9 {"add":true,"update":false}

通過示例可以看出,該用戶擁有的路由其實就三個頁面,分別是:文章列表,文章查看和添加/修改隨筆,注意:添加/修改隨筆extra里面設置了,add為true,update為false,意思是,只能添加,不能修改,前端可以在用戶進入這個頁面的時候,通過這個信息來決定到底能干啥,從而也就實現(xiàn)了細粒度控制每個頁面的具體操作。

最終給前端返回的數(shù)據(jù)格式如下:
{
    id:1,
    username:"賽冷思",
    routes:[
        {
            id:1,
            web_path:"manager",
            name:"內(nèi)容管理",
            extra:{},
            ...其他字段
            children:[
                {
                    id:2,
                    web_path:"article",
                    name:"文章管理",
                    extra:{},
                    children:[
                        {
                            id:3,
                            web_path:"list",
                            name:"文章列表",
                            extra:{},
                        },
                        {
                            id:4,
                            web_path:"view",
                            name:"文章詳情",
                            extra:{},
                        }
                    ]
                },
                {
                    {
                        id:6,
                        web_path:"mind",
                        name:"隨筆管理",
                        extra:{},
                        children:[
                            {
                                id:9,
                                web_path:"view",
                                name:"添加/修改隨筆",
                                extra:{
                                    test:"mind-edit",
                                    add:true,
                                    update:false
                                }
                            }
                        ]
                    }
                }
            ]
        }
    ]
}

大致思路就是這樣,回頭在實現(xiàn)的過程中發(fā)現(xiàn)不完善的,將會持續(xù)更新。

最新更新在我的博客:https://sailengsi.com/article/15

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/25991.html

相關(guān)文章

  • 手摸手,帶你用vue后臺 系列二(登錄權(quán)限篇)

    摘要:我們將登錄按鈕上綁上事件,點擊登錄之后向服務端提交賬號和密碼進行驗證。所以前端和后端權(quán)限的劃分是不太一致。側(cè)邊欄最后一個涉及到權(quán)限的地方就是側(cè)邊欄,不過在前 完整項目地址:vue-element-admin 系列文章: 手摸手,帶你用vue擼后臺 系列一(基礎篇) 手摸手,帶你用vue擼后臺 系列二(登錄權(quán)限篇) 手摸手,帶你用vue擼后臺 系列三 (實戰(zhàn)篇) 手摸手,帶你用vu...

    不知名網(wǎng)友 評論0 收藏0
  • 關(guān)于Vue2一些值得推薦文章 -- 五、六月份

    摘要:五六月份推薦集合查看最新的請點擊集前端最近很火的框架資源定時更新,歡迎一下。蘇幕遮燎沈香宋周邦彥燎沈香,消溽暑。鳥雀呼晴,侵曉窺檐語。葉上初陽乾宿雨,水面清圓,一一風荷舉。家住吳門,久作長安旅。五月漁郎相憶否。小楫輕舟,夢入芙蓉浦。 五、六月份推薦集合 查看github最新的Vue weekly;請::點擊::集web前端最近很火的vue2框架資源;定時更新,歡迎 Star 一下。 蘇...

    sutaking 評論0 收藏0

發(fā)表評論

0條評論

anRui

|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<