События

update:model-value

Срабатывает при изменении выбранного значения. В качестве параметра передает в обработчик выбранную опцию (тип String или Object)

open

Срабатывает тогда, когда раскрывается выпадающий список.

this.$emit('open')

close

Срабатывает тогда, когда закрывается выпадающий список.

this.$emit('close')

option:selecting

Срабатывает после выбора опции, перед обновлением внутреннего состояния.

this.$emit('option:selecting', selectedOption)

export type OptionSelectingHandler = (option: string | object) => void;

option:selected

Срабатывает после выбора опции, после обновления внутреннего состояния.

this.$emit('option:selected', selectedOption)

export type OptionSelectedHandler = (option: string | object) => void;

option:deselecting

Срабатывает после отмены опции, перед обновлением внутреннего состояния.

this.$emit('option:deselecting', selectedOption)

export type OptionDeselectingHandler = (option: string | object) => void;

option:deselected

Срабатывает после отмены опции, после обновления внутреннего состояния.

this.$emit('option:deselected', deselectedOption)

export type OptionDeselectedHandler = (option: string | object) => void;

option:created

Срабатывает, когда taggable имеет значение true и была создана новая опция.

/**
 * @param {Object} newOption - created option
 */
this.$emit('option:created', newOption)

export type OptionCreatedHandler = (option: string | object) => void;

search

Срабатывает всякий раз, когда строка поиска изменяется, генерируйте событие 'search'. Событие передается с двумя параметрами: строкой поиска и функцией, которая принимает логический параметр для переключения состояния загрузки.

Полный пример смотрите в руководстве по AJAX.

/**
 * @param {String} searchString - строка поиска
 * @param {Function} toggleLoading - функция переключающая состояние загрузки, принимает логические true или false
 */
this.$emit('search', this.search, this.toggleLoading)

<!-- example usage -->
<v-select
    @search="
    (search, loading) => {
      loading(true)
      fetchOptions(search).then(() => loading(false))
    }
  "
/>

export type ToggleLoadingFunction = (toggle: boolean | null) => boolean;
export type SearchHandler = (search: string, toggleFunction: ToggleLoadingFunction) => void;

search:blur

Срабатывает, когда ввод текста теряет фокус. Выпадающий список закроется непосредственно перед запуском этого события.

this.$emit('search:blur')

search:focus

Срабатывает, когда ввод текста получает фокус. Выпадающий список откроется непосредственно перед запуском этого события.

this.$emit('search:focus')