const routes = [
]{
path: "/",
name: "home",
meta: {
title: "",
icon: "el-icon-menu",
hide: true
},
},
{
path: "/monitor",
name: "",
meta: {
title: "",
hide: true
},
children: [
{
path: "/monitor/pass",
name: "",
meta: {
title: "",
hide: true
}
},
{
path: "/monitor/rules",
name: "",
meta: {
title: "",
hide: true
}
}
]
},
{
path: "/blacklist",
name: "",
meta: {
title: "",
hide: true
},
children: [
{
path: "/blacklist/id-card",
name: "",
meta: {
title: "",
hide: true
}
},
{
path: "/blacklist/companyName",
name: "",
meta: {
title: "",
hide: true
}
},
{
path: "/blacklist/companyPhone",
name: "",
meta: {
title: "",
hide: true
}
},
]
},
{
path: "/bairongLoaning",
name: "",
meta: {
title: "",
icon: "el-icon-view",
hide: true
}
}
],
const permission = ["homepage", "personnel list management", "setting parameters", "setting status"];
menu rendering is based on the title field in the meta of routes above. Now the scene is that the menu may have only one-level menu, or there may be a second-level menu, or there may be more. My menu is recursively rendered
, and now I want to control the hide field of meta in routes according to this permission array. If there is this permission in permission, set the hide of the meta of this menu to false.
then if it corresponds to the second-level menu, that is, in children, set the hide of this item.children.meta to false, and its parent menu also shows
how to write it is easy-sharp-sharp-sharp problem description
the environmental background of the problems and what methods you have tried
related codes
/ / Please paste the code text below (do not replace the code with pictures)