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.


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.



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.


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
StoreFor Enterprise