The v-list-item-group provides the ability to create a group of selectable v-list-items. The v-list-item-group component utilizes v-item-group at its core to provide a clean interface for interactive lists.

Usage

By default, the v-list-item-group operates similarly to v-item-group. If a value is not provided, the group will provide a default based upon its index.

API

Examples

De-emphasized selections

You can easily disable the default highlighting of selected v-list-items. This creates a lower profile for a user's choices.

Select multiple items

You can select multiple items at one time.

Mandatory

At least one item must be selected.

Custom active class

You can set a class which will be added when an item is selected.

Selection controls

Using the default slot, you can access an items internal state and toggle it. Since the active property is a boolean, we use the true-value prop on the checkbox to link its state to the v-list-item.

Edit this page on Github | Translate on Crowdin
Vuetify
StoreFor Enterprise