vue-element-admin后端获取路由菜单及按钮权限，怎么根据后端的数据实现每个页面的按钮控制？

Question

后端返回数据，：

{
"mid": 38,
"name": "系统管理",
"pid": 0,
"button": [],
"isHas": 1,
"sonData": [
{
"mid": 39,
"name": "菜单管理",
"pid": 38,
"button": [],
"isHas": 1,
"sonData": [
{
"mid": 40,
"name": "菜单列表",
"pid": 39,
"button": [
{
"code": "menu_add",
"name": "添加",
"isHas": 1
},
{
"code": "menu_edit",
"name": "编辑",
"isHas": 1
},
{
"code": "menu_del",
"name": "删除",
"isHas": 1
}
],
"isHas": 1,
"sonData": []
}
]
},
{
"mid": 41,
"name": "角色管理",
"pid": 38,
"button": [],
"isHas": 1,
"sonData": [
{
"mid": 42,
"name": "角色列表",
"pid": 41,
"button": [
{
"code": "role_add",
"name": "添加角色",
"isHas": 0
},
{
"code": "role_edit",
"name": "角色编辑",
"isHas": 0
},
{
"code": "role_del",
"name": "角色删除",
"isHas": 0
},
{
"code": "auth_add",
"name": "角色赋权限",
"isHas": 0
}
],
"isHas": 1,
"sonData": []
}
]
},
{
"mid": 43,
"name": "员工管理",
"pid": 38,
"button": [],
"isHas": 1,
"sonData": [
{
"mid": 44,
"name": "员工列表",
"pid": 43,
"button": [
{
"code": "user_add",
"name": "添加用户",
"isHas": 0
},
{
"code": "user_edit",
"name": "用户编辑",
"isHas": 0
},
{
"code": "user_del",
"name": "删除用户",
"isHas": 0
}
],
"isHas": 1,
"sonData": []
}
]
}
]
}

Answer 1

取到当前页面对应的button数组，在button上使用v-if去做判断