Combobox

Combobox info coming soon

用例

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

API

名称

allow-overflow

默认值

true

类型

boolean

Components.Combobox.

名称

append-icon

默认值

'$vuetify.icons.dropdown'

类型

string

Components.Combobox.

名称

append-outer-icon New in — v1.1

默认值

undefined

类型

string

Components.Combobox.

名称

attach

默认值

false

类型

any

指定该组件应该分离到哪个DOM元素，使用CSS选择器字符串或元素的对象应用。

名称

auto-select-first

默认值

false

类型

boolean

Components.Combobox.

名称

autofocus

默认值

false

类型

boolean

启用自动聚焦

名称

background-color

默认值

undefined

类型

string

Components.Combobox.

名称

box

默认值

false

类型

boolean

应用备用输入框样式

名称

browser-autocomplete

默认值

'off'

类型

string

Components.Combobox.

名称

cache-items

默认值

false

类型

boolean

保留已经通过 items 属性的项在本地的唯一副本

名称

chips

默认值

false

类型

boolean

改变一个已选择项为小纸片（chips）的显示方式

名称

clear-icon

默认值

'$vuetify.icons.clear'

类型

string

Components.Combobox.

名称

clearable

默认值

false

类型

boolean

添加输入框清除功能，默认图标是 Material Icons clear

名称

color

默认值

'primary'

类型

string

将指定的色彩应用与控件

名称

counter

默认值

undefined

类型

boolean | number | string

为输入长度创建一个计数器，如果未指定数字，则默认为25，不会应用任何验证。

名称

dark

默认值

false

类型

boolean

应用暗黑主题变体

名称

deletable-chips

默认值

false

类型

boolean

添加一个去除图标的到选定的小纸片（chips）

名称

dense

默认值

false

类型

boolean

减小列表的最大高度

名称

disabled

默认值

false

类型

boolean

Components.Combobox.

名称

dont-fill-mask-blanks

默认值

false

类型

boolean

键入时禁用自动字符显示

名称

error

默认值

false

类型

boolean

将输入框设置为手动错误状态。

名称

error-count

默认值

类型

number | string

Components.Combobox.

名称

error-messages

默认值

[]

类型

string | array

将输入框置于错误状态，并传入自定义的错误信息。将与来自规则（rules）属性的任何验证相结合。这个字段不会触发验证。

名称

filter

默认值

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

类型

function

Components.Combobox.

名称

flat

默认值

false

类型

boolean

Components.Combobox.

名称

full-width

默认值

false

类型

boolean

指定输入框为全屏宽度。

名称

height

默认值

undefined

类型

number | string

设置组件高度

名称

hide-details

默认值

false

类型

boolean

Components.Combobox.

名称

hide-no-data

默认值

false

类型

boolean

Components.Combobox.

名称

hide-selected

默认值

false

类型

boolean

不要在选择菜单中显示已选择的项

名称

hint

默认值

undefined

类型

string

Components.Combobox.

名称

item-avatar

默认值

avatar

类型

string | array | function

设置 items 属性的头像

名称

item-disabled

默认值

disabled

类型

string | array | function

禁用 items 的属性值

名称

item-text

默认值

text

类型

string | array | function

设置items'属性的文本值

名称

item-value

默认值

value

类型

string | array | function

设置items属性的值

名称

items

默认值

[]

类型

array

可以是一个对象数组或字符窜数组，当使用对象时，会查找文本和值字段，这可以使用 item-text 和 item-value 属性来改变。

名称

label

默认值

undefined

类型

string

Components.Combobox.

名称

light

默认值

false

类型

boolean

应用明亮主题变体

名称

默认值

false

类型

boolean | string

Components.Combobox.

名称

mask

默认值

undefined

类型

object | string

将自定义字符掩码应用于输入框。有关更多信息，请参阅上面的掩码表格。

名称

menu-props New in — v1.2

默认值

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

类型

string | array | object

Components.Combobox.

名称

messages

默认值

[]

类型

string | array

Components.Combobox.

名称

multiple

默认值

false

类型

boolean

多选，接受数组作为值

名称

no-data-text

默认值

'$vuetify.noDataText'

类型

string

当没有数据时显示的文本

名称

no-filter New in — v1.1

默认值

false

类型

boolean

Components.Combobox.

名称

open-on-clear

默认值

false

类型

boolean

当使用 clearable 属性, 一旦清除，选择菜单将打开或保持打开，这个取决于当前状态

名称

outline

默认值

false

类型

boolean

Components.Combobox.

名称

persistent-hint

默认值

false

类型

boolean

Components.Combobox.

名称

placeholder

默认值

undefined

类型

string

Components.Combobox.

名称

prefix

默认值

undefined

类型

string

显示前缀

名称

prepend-icon

默认值

undefined

类型

string

Components.Combobox.

名称

prepend-inner-icon New in — v1.1

默认值

undefined

类型

string

Components.Combobox.

名称

readonly

默认值

false

类型

boolean

Components.Combobox.

名称

return-masked-value

默认值

false

类型

boolean

返回未修改的掩码字符串

名称

return-object

默认值

true

类型

boolean

将选择器的行为更改为直接返回对象，而不是 item-value 指定的值

名称

reverse New in — v1.1

默认值

false

类型

boolean

Components.Combobox.

名称

rules

默认值

[]

类型

array

返回True或带有错误信息的字符串的函数数组。

名称

search-input

默认值

undefined

类型

any

使用自动补全（autocomplete）属性，使用 .sync 修饰符从自动补全搜索框中捕获用户的输入

名称

single-line

默认值

false

类型

boolean

Label does not move on focus/dirty

名称

small-chips New in — v1.1

默认值

false

类型

boolean

Components.Combobox.

名称

solo

默认值

false

类型

boolean

Components.Combobox.

名称

solo-inverted

默认值

false

类型

boolean

Components.Combobox.

名称

success New in — v1.1

默认值

false

类型

boolean

Components.Combobox.

名称

success-messages New in — v1.1

默认值

[]

类型

string | array

Components.Combobox.

名称

suffix

默认值

undefined

类型

string

显示后缀

名称

type

默认值

'text'

类型

string

设置输入类型

名称

validate-on-blur

默认值

false

类型

boolean

延迟验证直到失去焦点的事件被触发

名称

value

默认值

undefined

类型

any

控制可见性

名称

value-comparator

默认值

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

类型

function

Components.Combobox.

补充

**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	##:##:##

示例

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