ClearFilters

Renders a simple button, emitting the needed events when clicked.

Props

Name	Description	Type	Default
facetsIds	Array of facets ids used to get the selected filters for those facets.	Array
alwaysVisible	Flag to render the component even if there are no filters selected.	boolean	false

Slots

Name	Description	Bindings (name - type - description)
default

Events

A list of events that the component will emit:

• UserClickedClearAllFilters (opens new window): the event is emitted after the user clicks the button to clear a certain facets filter. The event payload is the id of the facets that are going to be cleared.
• UserClickedClearAllFilters (opens new window): the event is emitted after the user clicks the button. The event payload is undefined.

Examples

This component renders a button, which on clicked emits the UserClickedClearAllFilters or UserClickedClearAllFilters event.

Basic usage

<ClearFilters />

Customizing its contents

In this example, show the custom message in button.

<ClearFilters v-slot="{ selectedFilters }">
  Delete {{ selectedFilters.length }} selected
</ClearFilters>

In this example, show the custom message in button with always visible a true and list of facets ids.

<ClearFilters v-slot="{ selectedFilters }" :alwaysVisible="true" :facetsIds="facetsIds">
  Delete {{ selectedFilters.length }} selected
</ClearFilters>