Props

A list with all available props that the vSelect component accepts.

These are the available props. The vSelect component does not inherit attributes and all additional attributes are directly passed to the internal input element and can be used for further altering the behavior of the component like: disabled, readonly, pattern, required, autofocus. The fetching function won't be called unless the input is :valid

By default the component will try to fetch the options list even if there is no query. If the query is required you may pass the required or the minlengthattribute. The latter is recommended to avoid form HTML5 validation issues when the input is empty.

Prop	Default	Type	Description
value		Any	Enables v-model usage and determines the selected options.
stateful	false	Boolean	By default the component relies on :value / v-model for displaying the selected options and doesn't persist internal state. This way the UI changes only when the passed value changes. Setting this prop to true will enable internal state of the value that will be automatically updated on each input event. This should generally not be used in conjunction with v-model
query		String	Sets the query string in the input. Supports sync modifier.
from	[]	Array	Feed with options for the dropdown list
		Function	Function that returns the list array. Can be async i.e. promises are supported.
		String	URL that will be used for fetching the list via AJAX. See fetch prop.
as	undefined	String	Required when working with non primitive values (objects) to specify a ":" separated paths to label, value and index in that order for each list option. All paths are required. The index path should point to a unique primitive value for a reliable comparison and better performance. Check VSelectOption and this issue for more details. Example: as="label:value:id", as="user.name::id" Notice: In the last example value path was skipped (empty string) resulting in the whole object being assigned to the model.
		Array(String)	An array of paths to label, value and index properties. Check VSelectOption for more details.
fetch	fetchAdapter	Function	asyncfunction that returns the list array. The default function looks for URL in the from prop and makes requests via Fetch API. If the URL contains %s it will be replaced with the query in the input and will make requests each time the query changes. Examples: from="/users" - static url from="/users?q=%s" - dynamic url
parse		String	Path to property of the fetch response that contains the list array.
		Function	Function that returns the list array from the fetch response.
filter	auto	Boolean	Force enable / disable list filtering. By default filtering is enabled when from is considered static, i.e: is an array is a static URL ( has no %s) is a function with arity=0 ( expects no arguments )
		Function ( VSelectOption, query )	Custom function to filter the list against query. Notice: If provided it will force enable filtering and will override filterBy
filterBy	filterBy	Function	This is the default filtering function when filter prop is true
tagging	false	Boolean	Enable / disable tagging. When enabled for a list with non primitive values label path must be specified in the as prop.
		Function	Enable / disable tagging based on function returned value. Should return false or the option to be used as tag. async is supported. May be used to save tagged option to the server.
tag-keys	[]	Array(int)	Key codes that will trigger tagging. Enter key is always a tagging key and should not be listed! Example: :tag-keys="[9, 32, 188]" - use Tab, Spacebar and "," as tag separators
tags		Array(VSelectOption)	Use with sync modifier. A readonly list of VSelectOptions that corresponds to the current selected value. Useful when the value is set to a property of the option but you also need access to the whole option object.
multiple	auto	Boolean	Force enable / disable multiple selection. By default it's true when v-model is an array.
debounce	250	Number	Time in milliseconds to wait after typing before executing the fetching function for dynamic lists.
closeOnSelect	auto	Boolean
clearOnSelect	auto	Boolean
clearOnClose	auto	Boolean
find		Function/false	Function that receives and array of incomplete vSelectOptions and should return an array of options that can be used to complete them. The default function simply uses the :from prop.