mirror of
https://github.com/tenrok/vue-select.git
synced 2026-06-22 10:30:34 +03:00
docs: Add search event to documentation (#1342)
* Add search event to documentation * Fix jsdoc for other event examples * Add toggleLoading param to documentation * Update events.md Co-authored-by: Jeff Sagal <sagalbot@gmail.com>
This commit is contained in:
committed by
GitHub
parent
86dd03dfda
commit
94549ff903
+31
-2
@@ -4,7 +4,7 @@ Triggered when the selected value changes. Used internally for `v-model`.
|
|||||||
|
|
||||||
```js
|
```js
|
||||||
/**
|
/**
|
||||||
* @param val {Object|String}` - selected option.
|
* @param {Object|String} val - selected option.
|
||||||
*/
|
*/
|
||||||
this.$emit("input", val);
|
this.$emit("input", val);
|
||||||
```
|
```
|
||||||
@@ -63,11 +63,40 @@ Triggered when `taggable` is `true` and a new option has been created.
|
|||||||
|
|
||||||
```js
|
```js
|
||||||
/**
|
/**
|
||||||
* @param newOption {Object} - created option
|
* @param {Object} newOption - created option
|
||||||
*/
|
*/
|
||||||
this.$emit("option:created", newOption);
|
this.$emit("option:created", newOption);
|
||||||
```
|
```
|
||||||
|
|
||||||
|
## `search`
|
||||||
|
|
||||||
|
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](/guide/ajax.html#loading-options-with-ajax)
|
||||||
|
for a complete example.
|
||||||
|
|
||||||
|
```js
|
||||||
|
/**
|
||||||
|
* @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);
|
||||||
|
```
|
||||||
|
|
||||||
|
```vue
|
||||||
|
<!-- example usage -->
|
||||||
|
<v-select
|
||||||
|
@search="(search, loading) => {
|
||||||
|
loading(true)
|
||||||
|
fetchOptions(search).then(() => loading(false))
|
||||||
|
}"
|
||||||
|
/>
|
||||||
|
```
|
||||||
|
|
||||||
## `search:blur`
|
## `search:blur`
|
||||||
|
|
||||||
Triggered when the text input loses focus. The dropdown will close immediately before this
|
Triggered when the text input loses focus. The dropdown will close immediately before this
|
||||||
|
|||||||
Reference in New Issue
Block a user