# Search

Component name: <v-search>

# Examples

# Basic

# Basic API

Name Type Description Default
url String URL called asynchronously to fetch search results based on the user's search query. The supplied url must contain a {query} placeholder. -
placeholder String Placeholder text shown when search field is empty. -
min-chars Number The minimum number of search query characters required before searching starts. 2
option-id String Names the object property used to identify individual search results. The property must be unique across all options. -
label String Names the object property used to display the result. -
slot:custom-no-results Slot Slot used to show a custom message, when no results are found. -
@search-result Event Event triggered when a search with results has completed. The query value can be found in the $event object. -
@search-no-result Event Same as @search-result but without results. -
@select Event Event triggered when a selection has been made. The selected value can be found in the $event object. -

Notice

v-search also supports grouped options and options with meta labels using the same API as v-searchable-select

To show a list of trending topics when the search opens, apply the trending property.

# API

Name Type Description Default
trending Array Data used to display trending search topics. []

# Custom search results

Use the custom-result slot to define custom search result markup.

# API

Name Type Description Default
slot:custom-result Slot Use this slot to define custom search results. A scoped slot (opens new window) property called result is available. -