HistoryQuery
HistoryQuery
This component renders a history query suggestion combining two buttons: one for selecting this suggestion as the search query, and another one to remove this query suggestion from the history queries.
Props
Name | Description | Type | Default |
---|---|---|---|
suggestion | The history query suggestion to render. | HistoryQueryModel |
|
Events
Event name | Properties | Description |
---|---|---|
click | suggestion Suggestion - History Query suggestion dataevent MouseEvent - The original mouse event | Click on the History Query suggestion |
Slots
Name | Description | Bindings (name - type - description) |
---|---|---|
default | History Query content | v-bind Object - BaseSuggestion default slot scope: suggestion Suggestion - Suggestion dataquery string - The query that the suggestion belongs tofilter Filter or undefined - Suggestion's filter |
remove-button-content | History Query remove button content | suggestion Suggestion - History Query suggestion data |
Events
A list of events that the component will emit:
UserSelectedAHistoryQuery
(opens new window): the event is emitted after the user clicks the button. The event payload is the history query data.
Examples
Basic usage
This component only requires a prop called suggestion
Customizing slots content
Suggestion and remove buttons contents can be customized.
The default slot allows you to replace the content of the suggestion button. It has two properties,
the suggestion itself, and a string
of HTML with the matched query.
The other slot is called remove-button-content
, and allows you to set the content of the button
that serves to remove this query from the history. This slot only has one property, the suggestion.
Customizing the content with classes
The suggestionClass
prop can be used to add classes to the history query suggestion.
The removeButtonClass
prop can be used to add classes to the remove history query.