Combobox

Combobox info coming soon

Utilização

With Combobox, you can allow a user to create new values that may not be present in a provided items list.

API

Nome

allow-overflow

Padrão

true

Tipos

boolean

Components.Combobox.

Nome

append-icon

Padrão

'$vuetify.icons.dropdown'

Tipos

string

Components.Combobox.

Nome

append-outer-icon New in — v1.1

Padrão

undefined

Tipos

string

Components.Combobox.

Nome

attach

Padrão

false

Tipos

any

Components.Combobox.

Nome

auto-select-first

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

autofocus

Padrão

false

Tipos

boolean

Habilita focagem automática

Nome

background-color

Padrão

undefined

Tipos

string

Components.Combobox.

Nome

box

Padrão

false

Tipos

boolean

Aplica o estilo em caixa alternativo para o campo de entrada

Nome

browser-autocomplete

Padrão

'off'

Tipos

string

Components.Combobox.

Nome

cache-items

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

chips

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

clear-icon

Padrão

'$vuetify.icons.clear'

Tipos

string

Components.Combobox.

Nome

clearable

Padrão

false

Tipos

boolean

Adicionar a funcionalidade de limpar o input, ícone padrão é usa o clear do Material Icons

Nome

color

Padrão

'primary'

Tipos

string

Components.Combobox.

Nome

counter

Padrão

undefined

Tipos

boolean | number | string

Cria um contador para o tamanho da entrada. O padrão é 25 se nenhum número for especificado. Não é aplicada nenhuma validação.

Nome

dark

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

deletable-chips

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

dense

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

disabled

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

dont-fill-mask-blanks

Padrão

false

Tipos

boolean

Desativa a exibição automática de caracteres ao digitar

Nome

error

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

error-count

Padrão

Tipos

number | string

Components.Combobox.

Nome

error-messages

Padrão

[]

Tipos

string | array

Components.Combobox.

Nome

filter

Padrão

(item: object, queryText: string, itemText: string) => boolean

Tipos

function

Components.Combobox.

Nome

flat

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

full-width

Padrão

false

Tipos

boolean

Designa o tipo da entrada com largura total

Nome

height

Padrão

undefined

Tipos

number | string

Define a altura do componente

Nome

hide-details

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

hide-no-data

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

hide-selected

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

hint

Padrão

undefined

Tipos

string

Components.Combobox.

Nome

item-avatar

Padrão

avatar

Tipos

string | array | function

Components.Combobox.

Nome

item-disabled

Padrão

disabled

Tipos

string | array | function

Components.Combobox.

Nome

item-text

Padrão

text

Tipos

string | array | function

Components.Combobox.

Nome

item-value

Padrão

value

Tipos

string | array | function

Components.Combobox.

Nome

items

Padrão

[]

Tipos

array

Components.Combobox.

Nome

label

Padrão

undefined

Tipos

string

Components.Combobox.

Nome

light

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

Padrão

false

Tipos

boolean | string

Components.Combobox.

Nome

mask

Padrão

undefined

Tipos

object | string

Aplica uma máscara personalizada no input. Para mais informações, veja a tabela de máscaras abaixo

Nome

menu-props New in — v1.2

Padrão

{"closeOnClick":false, "closeOnContentClick":false, "openOnClick":false, "maxHeight":300}

Tipos

string | array | object

Components.Combobox.

Nome

messages

Padrão

[]

Tipos

string | array

Components.Combobox.

Nome

multiple

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

no-data-text

Padrão

'$vuetify.noDataText'

Tipos

string

Components.Combobox.

Nome

no-filter New in — v1.1

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

open-on-clear

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

outline

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

persistent-hint

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

placeholder

Padrão

undefined

Tipos

string

Components.Combobox.

Nome

prefix

Padrão

undefined

Tipos

string

Exibe um texto como prefixo

Nome

prepend-icon

Padrão

undefined

Tipos

string

Components.Combobox.

Nome

prepend-inner-icon New in — v1.1

Padrão

undefined

Tipos

string

Components.Combobox.

Nome

readonly

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

return-masked-value

Padrão

false

Tipos

boolean

Retorna a string mascarada não modificada

Nome

return-object

Padrão

true

Tipos

boolean

Components.Combobox.

Nome

reverse New in — v1.1

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

rules

Padrão

[]

Tipos

array

Components.Combobox.

Nome

search-input

Padrão

undefined

Tipos

any

Components.Combobox.

Nome

single-line

Padrão

false

Tipos

boolean

Label não se move em eventos focus/dirty

Nome

small-chips New in — v1.1

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

solo

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

solo-inverted

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

success New in — v1.1

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

success-messages New in — v1.1

Padrão

[]

Tipos

string | array

Components.Combobox.

Nome

suffix

Padrão

undefined

Tipos

string

Exibe um texto como sufixo

Nome

type

Padrão

'text'

Tipos

string

Seta o tipo do campo de entrada

Nome

validate-on-blur

Padrão

false

Tipos

boolean

Components.Combobox.

Nome

value

Padrão

undefined

Tipos

any

Controla visibilidade

Nome

value-comparator

Padrão

(a: any, b: any) => boolean

Tipos

function

Components.Combobox.

Suplementar

**Mask legend**
Mask	Description
Masks
#	Any digit
A	Any capital letter
a	Any small letter
N	Any capital alphanumeric character
n	Any small alphanumeric character
X	Any special symbol (-!$%^&*()_+\|~=`{}[]:";'<>?,./\) or space
Pre-made
credit-card	#### - #### - #### - ####
date-with-time	##/##/#### ##:##
phone	(###) ### - ####
social	###-##-####
time	##:##
time-with-seconds	##:##:##

Exemplos

No data with chips

In this example we utilize a custom no-data slot to provide context to the user when searching / creating items.

Advanced custom options

The v-combobox improves upon the added functionality from v-select and v-autocomplete. This provides you with an expansive interface to create truly customized implementations. This example takes advantage of some more advanced features such as a custom filter algorithm, inline list editing and dynamic input items.

Multiple combobox

Previously known as tags - user is allowed to enter more than 1 value

Up Next

Edit this page | language on Github

— Contribution Guide