My navigation dynamically retrieves routes from the vue-router, eliminating the need for manual addition.
Within these routes, there is a boolean key named "inMenu" in both parent and child routes. I have successfully filtered out the parent routes based on this key, but struggling to do the same for the child routes.
var res = this.$router.options.routes.filter(function f(o) {
if (o.route.meta.inMenu === true) return true
if (o.children) {
return (o.children = o.children.filter(f)).length
}
})
Although I've managed to filter the parent routes using the above code snippet, I'm facing difficulties applying the same logic to filter out the children.
return this.$router.options.routes.filter(route => route.meta.inMenu === true);
Here is some example data to illustrate the structure:
{
"path": "/orders",
"component": {
"name": "Orders",
"__file": "src/views/Orders.vue",
},
"meta": {
"icon": "fa-history",
"title": "Abwicklungen",
"inMenu": true
},
"children": [
{
"path": "list",
"name": "orderList",
"component": {
"name": "OrderList",
"__file": "src/views/orders/list.vue",
},
"meta": {
"title": "Bestellliste",
"icon": "fa-circle-o",
"inMenu": true
}
},
{
"path": "details/:id",
"name": "orderDetails",
"component": {
"name": "OrderDetails",
"__file": "src/views/orders/details.vue"
},
"meta": {
"title": "Bestellung",
"icon": "fa-circle-o",
"inMenu": false
}
},
{
"path": "dailyclosing",
"component": {
"name": "OrderList",
"__file": "src/views/orders/list.vue",
},
"meta": {
"title": "Tagesabschluss",
"icon": "fa-check",
"inMenu": true
}
}
]
}
I aim to hide any route or its children with the "inMenu" key set to false.