V-NavMenu Group

Vuexy Admin uses extended sidebar group in v-nav-menu component.
Vuexy Admin在v-nav-menu组件中使用扩展侧栏组。

Name Update

VxSidebarGroup component is now VerticalNavMenuGroup.

Overview

Component Name: v-nav-menu-group
Use case: Build group in v-nav-menu component
Path: src/layouts/components/vertical-nav-menu/VerticalNavMenuGroup.vue
Is Globally Registred: false

Using Component

This component is internally handled by v-nav-menu. So, you don’t have to worry about setting up vx-siedbar-group.
该组件由v-nav-menu内部处理。因此，您不必担心设置vx-siedbar-group

How to create sidebar group in sidebarItems prop of v-nav-menu
如何在v-nav-menu的sidebarItems道具中创建侧栏组

...
    {
        url: null,
        name: "Dashboard",
        slug: "dashboard",
        icon: "HomeIcon",
        i18n: "Dashboard",
        submenu: [
            {
                url: '/dashboard/analytics',
                name: "Analytics",
                slug: "dashboardAnalytics",
                i18n: "Analytics",
            },
            {
                url: '/dashboard/ecommerce',
                name: "eCommerce",
                slug: "dashboardECommerce",
                i18n: "eCommerce",
            },
        ]
    },
...

Above code will create group named Dashboard from it’s i18n property. If i18n is disabled in your app then It will fall back to name property.
submenu property differentiate sidebar group from sidebar item and item/group header.
上面的代码将通过其i18n属性创建名为Dashboard的组。如果您的应用程序中禁用了i18n，则它将回退到name属性。 submenu属性将侧边栏组与侧边栏项目以及项目/组标题区分开。

You can customize should group open on hover.
您可以自定义hover时打开的组。

To open groups on hover you can set v-nav-menu prop openGroupHover to true.
要在hover时打开组，可以将v-nav-menu prop openGroupHover设置为true。

Changing Styles

v-nav-menu-group component’s style are only invoked in it’s components. It is not globally available. So, If you plan to use stock sidebar provided by Vuesax Framework then you won’t get useless styles of v-nav-menu-group.
Styles of this component is imported at the button of file. Styles of sidebar component can be found in src/assets/scss/vuexy/components/VerticalNavMenuGroup.scss

Dependencies

• Vuex Store
• v-nav-menu-item component
• feather-icon component