Skip to content
PropDefaultType
as
'div'
AsTag | Component

The element or component this component should render as. Can be overwritten by asChild.

asChild
boolean

Change the default rendered element for the one passed as a child, merging their props and behavior.

Read our Composition guide for more details.

defaultOpen
boolean

The open state of the combobox when it is initially rendered.
Use when you do not need to control its open state.

defaultValue
AcceptableValue | AcceptableValue[]

The value of the combobox when initially rendered. Use when you do not need to control the state of the Combobox

dir
'ltr' | 'rtl'

The reading direction of the combobox when applicable.
If omitted, inherits globally from ConfigProvider or assumes LTR (left-to-right) reading mode.

disabled
boolean

When true, prevents the user from interacting with Combobox

displayValue
((val: AcceptableValue) => string)

The display value of input for selected item. Does not work with multiple.

filterFunction
((val: string[] | number[] | false[] | true[] | Record<string, any>[], term: string) => string[] | number[] | false[] | true[] | Record<string, any>[])

The custom filter function for filtering ComboboxItem.

modelValue
AcceptableValue | AcceptableValue[]

The controlled value of the Combobox. Can be binded with with v-model.

multiple
boolean

Whether multiple options can be selected or not.

name
string

The name of the Combobox. Submitted with its owning form as part of a name/value pair.

open
boolean

The controlled open state of the Combobox. Can be binded with with v-model:open.

resetSearchTermOnBlur
true
boolean

Whether to reset the searchTerm when the Combobox input blurred

resetSearchTermOnSelect
true
boolean

Whether to reset the searchTerm when the Combobox value is selected

searchTerm
string

The controlled search term of the Combobox. Can be binded with with v-model:searchTerm.

selectedValue
AcceptableValue

The current highlighted value of the COmbobox. Can be binded with v-model:selectedValue.

EmitPayload
update:modelValue
[value: AcceptableValue]

Event handler called when the value changes.

update:open
[value: boolean]

Event handler called when the open state of the combobox changes.

update:searchTerm
[value: string]

Event handler called when the searchTerm of the combobox changes.

update:selectedValue
[value: AcceptableValue]

Event handler called when the highlighted value of the combobox changes

Slots (default)Payload
open
boolean

Current open state

modelValue
AcceptableValue | AcceptableValue[]

Current active value