PreselectedFilters

This component emits FacetsXEvents.PreselectedFiltersProvided when a preselected filter is set in the snippet config or by using the prop of the component.

Props

Name	Description	Type	Default
filters	A list of filters to preselect.	string[]	() => []

Events

A list of events that the component will emit:

PreselectedFiltersProvided (opens new window).

See it in action

See how the event is triggered when the component is rendered.

<template>
  <PreselectedFilters />
</template>
<script>
  import { PreselectedFilters } from '@empathyco/x-components';
  export default {
    name: 'PreselectedFiltersDemo',
    components: {
      PreselectedFilters
    },
    provide: {
      snippetConfig: {
        filters: ['{!tag=brand_facet}brand_facet:"Lego"', '{!tag=age_facet}age_facet:"toddler"']
      }
    }
  };
</script>

Play with props

In this example, the preselected filters have been configured to use a list of configured filters by prop:

<template>
  <PreselectedFilters :filters="filters" />
</template>
<script>
  import { PreselectedFilters } from '@empathyco/x-components';
  export default {
    name: 'PreselectedFiltersDemo',
    components: {
      PreselectedFilters
    },
    computed: {
      filters() {
        return ['{!tag=brand_facet}brand_facet:"Lego"', '{!tag=age_facet}age_facet:"toddler"'];
      }
    }
  };
</script>