This component renders a button to delete the current query.
(name - type - description)
| ||Required. Button content (text, icon, or both)||None|
This component emits the following events:
See it in action
Here a basic example of how the clear button is rendered.
Type any term in the input field and then click the Clear button to try it out!
Play with default slot
In this example, a custom text is passed in the default slot instead of the default text to customize the button content.
Click the icon button to try it out!
Play with events
In this example, the
UserPressedClearSearchBoxButton event is implemented, triggering the message
“clear” when the clear search input button is clicked.
Click the Clear button to try it out!
Extending the component
Components can be combined and communicate with each other. Commonly, the
component communicates with the
SearchInput, deleting the search term
Type any term in the input field and then click the icon button to try it out!