[Vuejs]-Return multi-level menu drawer navigation items based on permissions

by

0👍

✅

Working solution in the codepen: https://codepen.io/simonsnetwork/pen/YzvgVBa?editors=0111

Basically I can use computed properties in Vue stacked together, so I created two computed properties: filterSubItems(subItems) for menu search and filterSubItemsByPermissions(subItems) for menu permissions.

<v-list-item
    v-for="child in filterSubItems(filterSubItemsByPermissions(item.items))"
    :key="child.title"
    :to="child.link"
    dense
    link
    >
    <v-list-item-content>
      <v-list-item-title>{{ child.title }}</v-list-item-title>
    </v-list-item-content>
</v-list-item>

Leave a comment