Vue Select

# input

Triggered when the selected value changes. Used internally for v-model.

/**
 * @param {Object|String} val - selected option.
 */
this.$emit("input", val);

# open

Triggered when the dropdown is open.

this.$emit("open");

# close

Triggered when the dropdown is closed.

this.$emit("close");

# option:selecting v3.11.0+

Triggered after an option has been selected, before updating internal state.

this.$emit("option:selecting", selectedOption);

# option:selected v3.11.0+

Triggered when an option has been selected, after updating internal state.

this.$emit("option:selected", selectedOption);

# option:deselecting v3.11.0+

Triggered when an option has been deselected, before updating internal state.

this.$emit("option:deselecting", selectedOption);

# option:deselected v3.11.0+

Triggered when an option has been deselected, after updating internal state.

this.$emit("option:deselected", deselectedOption);

# option:created

Triggered when taggable is true and a new option has been created.

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

Anytime the search string changes, emit the 'search' event. The event is passed with two parameters: the search string, and a function that accepts a boolean parameter to toggle the loading state.

See the AJAX Guide for a complete example.

/**
 * @param {String} searchString - the search string
 * @param {Function} toggleLoading - function to toggle loading state, accepts true or false boolean
 */
this.$emit('search', this.search, this.toggleLoading);

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

# search:blur

Triggered when the text input loses focus. The dropdown will close immediately before this event is triggered.

this.$emit("search:blur");

# search:focus

Triggered when the text input gains focus. The dropdown will open immediately before this event is triggered.

this.$emit("search:focus");

←