Skip to content
Branch: master
Find file Copy path
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
95 lines (94 sloc) 5.56 KB
"header": "# Select",
"headerText": "Select fields components are used for collecting user provided information from a list of options.",
"supplemental": [
"examples": {
"usage": {
"desc": ""
"light": {
"header": "### Light theme",
"desc": "A standard single select has a multitude of configuration options."
"icons": {
"header": "### Icons",
"desc": "Use a custom prepended or appended icon."
"multiple": {
"header": "### Multiple",
"desc": "A multi-select can utilize `v-chip` as the display for selected items."
"customTextAndValue": {
"header": "### Customized item text and value",
"desc": "You can specify the specific properties within your items array correspond to the text and value fields. By default, this is **text** and **value**. In this example we also use the `return-object` prop which will return the entire object of the selected item on selection."
"slots": {
"header": "### Prepend/Append item slots",
"desc": "The `v-select` components can be optionally expanded with prepended and appended items. This is perfect for customized **select-all** functionality."
"selectionAppearance": {
"header": "### Change selection appearance",
"desc": "The `selection` scoped slot can be used to customize the way selected values are shown in the input. This is great when you want something like `foo (+20 others)` or don't want the selection to occupy multiple lines."
"props": {
"attach": "Mixins.Detachable.props.attach",
"autocomplete": "Filter the items in the list based on user input",
"browserAutocomplete": "Set browser autocompletion for the search input",
"cacheItems": "Keeps a local _unique_ copy of all items that have been passed through the **items** prop.",
"chips": "Changes display of selections to chips",
"combobox": "The single select variant of **tags**",
"contentClass": "Mixins.Detachable.props.contentClass",
"debounceSearch": "Debounces the search input value being emitted",
"deletableChips": "Adds a remove icon to selected chips",
"dense": "Lowers max height of list items",
"disabled": "Disables the input",
"editable": " Creates an editable button - [spec](",
"filter": "The function used for filtering items",
"hideSelected": "Do not display in the select menu items that are already selected",
"itemAvatar": "Set property of **items**'s avatar value",
"itemDisabled": "Set property of **items**'s disabled value",
"itemText": "Set property of **items**'s text value",
"itemValue": "Set property of **items**'s value - **must be primative**. Dot notation is supported",
"items": "Can be an array of objects or array of strings. When using objects, will look for a text and value field. This can be changed using the **item-text** and **item-value** props.",
"menuProps": "Pass props through to the `v-menu` component. Accepts either a string for boolean props `menu-props=\"auto, overflowY\"`, or an object `:menu-props=\"{ auto: true, overflowY: true }\"`",
"minWidth": "Sets the minimum width of the select's `v-menu` content",
"multiple": "Changes select to multiple. Accepts array for value",
"multiLine": "Causes label to float when the select component is focused or dirty",
"noDataText": "Display text when there is no data",
"openOnClear": "When using the **clearable** prop, once cleared, the select menu will either open or stay open, depending on the current state",
"overflow": "Creates an overflow button - [spec](",
"returnObject": "Changes the selection behavior to return the object directly rather than the value specified with **item-value**",
"searchInput": "Use the **.sync** modifier to catch user input from the search input",
"segmented": "Creates a segmented button - [spec](",
"smallChips": "Changes display of selections to chips with the **small** property",
"tags": "Tagging functionality, allows the user to create new values not available from the **items** prop",
"valueComparator": "The comparison algorithm used for values. [More info](",
"value": "Components.Inputs.props.value"
"slots": {
"append": "Components.Inputs.slots.append",
"append-outer": "Components.TextFields.slots.append-outer",
"prepend": "Components.Inputs.slots.prepend",
"prepend-inner": "Components.TextFields.slots.prepend-inner",
"append-item": "Adds an item after menu content",
"no-data": "Mixins.Filterable.slots.noData",
"prepend-item": "Adds an item before menu content"
"scopedSlots": {
"item": "Define a custom item appearance",
"selection": "Define a custom selection appearance"
"events": {
"change": "",
"click:append": "['click:append']",
"click:append-outer": "['click:append-outer']",
"click:clear": "['click:clear']",
"click:prepend": "['click:prepend']",
"click:prepend-inner": "['click:prepend-inner']",
"update:error": "['update:error']",
"update:searchInput": "The `search-input.sync` event"
You can’t perform that action at this time.