ankow
OverviewBreadCrumbButtonButtonGroupClipboardDialogDirectoryViewFileUploaderFormTextInputPasswordInputEmailInputNumberInputDateTimeInputTagInputCheckBoxRadioButtonSwitchFormGroupInputGroupIconLayoutMainLayoutTopBarBottomBarListItemMenuMultiSelectNotificationOfflineBannerPopoverProgressBarSaveIndicatorSectionItemSettingsItemSingleSelectSplitLayoutSpinnerTabViewTableViewTooltipTextOverflowTreeViewSingleSelect
disabled
Pasta
value is the selected object
Pasta
{ "display": "Pasta", "id": "pasta" }With explicit :option-key, result is the key value not the object:
Falafel
falafelNo initial value
Nothing yet selected
Without dropdown icon
Pasta
Usage
API
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| v-model | Any | - | Selected value (object or key value) |
| options | Array | [] | Array of option objects |
| optionLabel | String | "label" | Property name for display text |
| optionKey | String | "" | Property name for value. If set, v-model is key, not object |
| placeholder | String | "Select" | Placeholder when nothing selected |
| disabled | Boolean | false | Disable the select |
| searchThreshold | Number | Infinity | Show search filter when options exceed this count |
| showDropdown | Boolean | true | Show dropdown chevron icon |
| required | Boolean | false | Required for form validation |
Events
| Event | Payload | Description |
|---|---|---|
| select | value | Emitted when selection changes |
| close | - | Emitted when dropdown closes |
Option Properties
| Property | Type | Description |
|---|---|---|
| [optionLabel] | String | Display text |
| [optionKey] | Any | Unique identifier |
| icon | String | FontAwesome icon class |
| disabled | Boolean | Disable this option |
| separator | Boolean | Render as separator |