Use search results in ais-instant-search about meilisearch-vue HOT 6 OPEN

Hello @ThisIsMyFavouriteJar

You can map on all search results using transformItems. Here is the documentation about it.

In your case for example you could do something like:

<template>
  <!-- ... -->
  <ais-hits :transform-items="transformItems" />
</template>

In your methods field

transformItems(items) {
      const brands = items.find((item) => item.brand && item.brand.length > 0)
      if (brands.length > 0) {
        // hide your component
      }
      return items
    },

from meilisearch-vue.

Hi @bidoubiwa , thank you for your answer! Actually I tried this method, but somehow it appears that as soon as I change the necessary variables (e.g. this.showBrands) that Instantsearch automatically makes another request without any filters, thereby immediately negating the change to this.showBrands.

I guess my problem / question is now as follows: How to call a function in 'methods' (where instantMeiliSearch is defined in the data() ) without making another call to Meilisearch?

Hope my answer is clear, and appreciate your help!

from meilisearch-vue.

After some searching I found this:
https://stackoverflow.com/questions/57193330/updating-unrelated-vue-js-variable-causing-input-values-in-template-to-disappear

Turns out that Vue re-renders everything once a variable is updated, in my case causing all original inputs to disappear. Seems to me that this makes it rather hard to use transformItems to get the necessary values......

Edit: It seems the reason everything is rendering again has to do with the way I update my variables. Perhaps this is the way to go after all!

from meilisearch-vue.

Hello @ThisIsMyFavouriteJar

Did you manage to make it work ?

from meilisearch-vue.

Hi @bidoubiwa , unfortunately not yet. The problem seems to be that changing the variable to hide the filter title causes vue to rerender, resetting all search criteria.... Not sure if I am doing things wrong, or if this is just the nature of vue. If you managed to make this work in an earlier project of yours it would be great to hear how you did it!

from meilisearch-vue.

@ThisIsMyFavouriteJar

Is your code on an open repo? In case not could you share your instantSearch configuration through a gist?

from meilisearch-vue.