vue 实现后台权限管理

1.权限管理思路 （权限(被分配)——》角色(被分配）---------》用户）  框架采用 vue-element-admin

2，我设计是角色中直接配置权限，看界面

  角色列表

 点击列表中  权限设置  打开的界面

  

权限设置中的树形菜单结构  id是唯一的。对应动态路由中  meta: {      permission: "对应树形菜单中唯一的id"    },  便于后期比对显示动态路由

{

    "data": [

        {

            "label": "测试模块",

            "id": "test",

            "children": [

                {

                    "label": "测试列表",

                    "id": "test-list",

                    "children": [

                        {

                            "label": "增加",

                            "id": "test-add"

                        },

                        {

                            "label": "删除",

                            "id": "test-delete"

                        },

                        {

                            "label": "修改",

                            "id": "test-update"

                        },

                        {

                            "label": "查看",

                            "id": "test-view"

                        }

                    ]

                }

            ]

        },
   ]
}

看一下动态路由 

 {
      path: 'test',
      component: () => import('@/views/modular/test/index'),
      name: 'test',
      alwaysShow: true,
      meta: {
        title: '测试模块',
        noCache: true,
        permission: "test",
      },
      children: [{
        path: 'test-list',