We have an implementation of Algolia search using the InstantSearch Vue components.
My understanding is that Algolia can dynamically show facets depending on the items in the search result - for example, showing 'memory' if there are a large proportion of mobile phones in the results, 'size' if there are a large proportion of TVs, etc.
We're trying to accomplish this using the ais-dynamic-widgets component. We've set up the facets and the facet display in the dashboard.
From the name, you'd expect ais-dynamic-widgets to dynamically show widgets - but from our experience and the examples in the docs it appears it's still required to manually list the facet widgets within the component:
<ais-dynamic-widgets>
<ais-refinement-list attribute="brand" />
<ais-panel>
<ais-menu attribute="categories" />
</ais-panel>
<ais-hierarchical-menu :attributes="['categories']" />
</ais-dynamic-widgets>
Using Vue Inspector I can see that ais-dynamic-widgets is aware of the defined facets - they appear in data.state.attributesToRender:
I would expect to be able to do something like:
<ais-dynamic-widgets>
<ais-refinement-list v-for="attr in data.state.attributesToRender" :key="attr" :attribute="attr" />
</ais-dynamic-widgets>
But:
- I can't find a way to reference this data (likely my lack of Vue skills
- If this did work, will it automatically only show applicable facets?
