VChipGroup API
组件页面
属性
| 名称 | 类型 | 默认值 |
|---|---|---|
| center-active | ||
| Forces the selected chip to be centered. | ||
| color | ||
| Applies specified color to the control - supports utility colors (for example success or purple) or css color (#033 or rgba(255, 0, 0, 0.5)). Find a list of built-in classes on the colors page . | ||
| column | ||
| Remove horizontal pagination and wrap items as needed. | ||
| direction | ||
| Switch between horizontal and vertical modes. | ||
| disabled | ||
| Puts all children components into a disabled state. | ||
| filter | ||
| Applies an checkmark icon in front of every chip for using it like a filter. | ||
| mandatory | ||
| Forces at least one item to always be selected (if available). | ||
| max | ||
| Sets a maximum number of selections that can be made. | ||
| mobile | ||
| Determines the display mode of the component. If true, the component will be displayed in mobile mode. If false, the component will be displayed in desktop mode. If null, will be based on the current mobile-breakpoint | ||
| mobile-breakpoint | ||
| Sets the designated mobile breakpoint for the component. | ||
| model-value | ||
| The v-model value of the component. If component supports the multiple prop, this defaults to an empty array. | ||
| multiple | ||
| Allows one to select multiple items. | ||
| next-icon | ||
| Specify the icon to use for the next icon. | ||
| prev-icon | ||
| Specify the icon to use for the prev icon. | ||
| selected-class | ||
| Configure the active CSS class applied when an item is selected. | ||
| show-arrows | ||
| Force the display of the pagination arrows. | ||
| symbol | ||
| The Symbol used to hook into group functionality for components like v-btn-toggle and v-bottom-navigation . | ||
| tag | ||
| Specify a custom tag used on the root element. | ||
| theme | ||
| Specify a theme for this component and all of its children. | ||
| value-comparator | ||
| Apply a custom comparison algorithm to compare model-value and values contains in the items prop. | ||
| variant | ||
| Applies a distinct style to the component. | ||
事件
| 名称 | 类型 |
|---|---|
| update:modelValue | |
| Event that is emitted when the component’s model changes. | |
插槽
| default |
| The default Vue slot. |
SASS 变量
| 名称 | 默认值 |
|---|---|
| $chip-group-margin | |
| $chip-group-padding | |
| $chip-group-selected-opacity | |