Select

Поля компонента Select используются для сбора предоставленной пользователем информации из списка параметров.

API

v-select
Имя
append-icon
По умолчанию
'$vuetify.icons.dropdown'
Тип
string

Components.Selects.

Имя
append-outer-icon New in — v1.1
По умолчанию
undefined
Тип
string

Components.Selects.

Имя
attach
По умолчанию
false
Тип
any

Указывает, какой элемент DOM должен отделить этот компонент. Используйте либо селектор CSS, либо ссылку на объект для элемента.

Имя
autofocus
По умолчанию
false
Тип
boolean

Включить автофокусировку

Имя
background-color
По умолчанию
undefined
Тип
string

Components.Selects.

Имя
box
По умолчанию
false
Тип
boolean

Применяет стиль ввода альтернативного ввода

Имя
browser-autocomplete
По умолчанию
'on'
Тип
string

Установите свойство автозаполнения для поискового ввода при использовании свойства autocomplete

Имя
cache-items
По умолчанию
false
Тип
boolean

Сохраняет локальную копию всех элементов, прошедших через свойство items.

Имя
chips
По умолчанию
false
Тип
boolean

Изменяет отображение выбранных chips

Имя
clear-icon
По умолчанию
'$vuetify.icons.clear'
Тип
string

Components.Selects.

Имя
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

Отключает ввод

Имя
dont-fill-mask-blanks
По умолчанию
false
Тип
boolean

Отключает автоматическое отображение символов при наборе текста

Имя
error
По умолчанию
false
Тип
boolean

Вставляет состояние ошибки в ввод вручную

Имя
error-count
По умолчанию
1
Тип
number | string

Components.Selects.

Имя
error-messages
По умолчанию
[]
Тип
string | array

Вставляет состояние ошибки в ввод и передаёт пользовательские сообщения об ошибках. Будет сочетаться с любыми валидациями, которые возникают из rules. Это поле не инициирует проверку

Имя
flat
По умолчанию
false
Тип
boolean

Components.Selects.

Имя
full-width
По умолчанию
false
Тип
boolean

Сбрасывает тип ввода как полную ширину

Имя
height
По умолчанию
undefined
Тип
number | string

Установка высоты компонента

Имя
hide-details
По умолчанию
false
Тип
boolean

Components.Selects.

Имя
hide-selected
По умолчанию
false
Тип
boolean

Не отображать в элементах select , которые уже выбраны

Имя
hint
По умолчанию
undefined
Тип
string

Components.Selects.

Имя
item-avatar
По умолчанию
avatar
Тип
string | array | function

Установить свойству items значение аватара

Имя
item-disabled
По умолчанию
disabled
Тип
string | array | function

Установить свойству items отключено

Имя
item-text
По умолчанию
text
Тип
string | array | function

Установить свойству items значение text

Имя
item-value
По умолчанию
value
Тип
string | array | function

Установить свойству items значение

Имя
items
По умолчанию
[]
Тип
array

Может быть массив объектов или массив строк. При использовании объектов будет искать поле текста и значения. Это можно изменить с помощью item-text и item-value свойств.

Имя
label
По умолчанию
undefined
Тип
string

Components.Selects.

Имя
light
По умолчанию
false
Тип
boolean

Применяет светлый вариант темы

Имя
loading
По умолчанию
false
Тип
boolean | string

Components.Selects.

Имя
mask
По умолчанию
undefined
Тип
object | string

Примените специальную маску на вход. Для получения дополнительной информации см. Таблицу масок выше

Имя
menu-props New in — v1.2
По умолчанию
{"closeOnClick":false, "closeOnContentClick":false, "openOnClick":false, "maxHeight":300}
Тип
string | array | object

Components.Selects.

Имя
messages
По умолчанию
[]
Тип
string | array

Components.Selects.

Имя
multiple
По умолчанию
false
Тип
boolean

Множественные изменения select. Принимает массив для значения

Имя
no-data-text
По умолчанию
'$vuetify.noDataText'
Тип
string

Отображать текст, когда нет данных

Имя
open-on-clear
По умолчанию
false
Тип
boolean

При использовании свойства clearable , после очистки, меню выбора будет либо открыто, либо оставаться открытым, в зависимости от текущего состояния

Имя
outline
По умолчанию
false
Тип
boolean

Components.Selects.

Имя
persistent-hint
По умолчанию
false
Тип
boolean

Components.Selects.

Имя
placeholder
По умолчанию
undefined
Тип
string

Components.Selects.

Имя
prefix
По умолчанию
undefined
Тип
string

Отображает префиксный текст

Имя
prepend-icon
По умолчанию
undefined
Тип
string

Components.Selects.

Имя
prepend-inner-icon New in — v1.1
По умолчанию
undefined
Тип
string

Components.Selects.

Имя
readonly
По умолчанию
false
Тип
boolean

Components.Selects.

Имя
return-masked-value
По умолчанию
false
Тип
boolean

Возвращает неизмененную строку в маске

Имя
return-object
По умолчанию
false
Тип
boolean

Изменяет поведение выбора, чтобы вернуть объект напрямую, а не значение, указанное с помощью значения item-value

Имя
reverse New in — v1.1
По умолчанию
false
Тип
boolean

Components.Selects.

Имя
rules
По умолчанию
[]
Тип
array

Массив функций, возвращающих True или String с сообщением об ошибке

Имя
single-line
По умолчанию
false
Тип
boolean

Ярлык не перемещается на фокус/dirty

Имя
small-chips New in — v1.1
По умолчанию
false
Тип
boolean

Components.Selects.

Имя
solo
По умолчанию
false
Тип
boolean

Components.Selects.

Имя
solo-inverted
По умолчанию
false
Тип
boolean

Components.Selects.

Имя
success New in — v1.1
По умолчанию
false
Тип
boolean

Components.Selects.

Имя
success-messages New in — v1.1
По умолчанию
[]
Тип
string | array

Components.Selects.

Имя
suffix
По умолчанию
undefined
Тип
string

Отображает суффикс-текста

Имя
type
По умолчанию
'text'
Тип
string

Устанавливает тип ввода

Имя
validate-on-blur
По умолчанию
false
Тип
boolean

Задержка проверки до размытия

Имя
value
По умолчанию
undefined
Тип
any

Контроль видимости

Имя
value-comparator
По умолчанию
(a: any, b: any) => boolean
Тип
function

Components.Selects.

Дополнительный

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

Примеры

Светлая тема

Стандартный одиночный select имеет множество параметров конфигурации.

Иконки

Используйте свою или добавленную иконку.

Множественный select

Multi-select может использовать v-chip для отображения выбранных элементов.

Настроенный текст и значение элемента

Вы можете указать конкретные свойства в вашем массиве элементов, соответствующие полям текста и значения. По умолчанию это текст и значение. В этом примере мы также используем свойство return-object, которое вернёт весь объект выбранного элемента при выборе.

Prepend/Append item slots

The v-select components can be optionally expanded with prepended and appended items. This is perfect for customized select-all functionality.

Change selection appearance

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.

Edit this page | language on Github