[Feature] Only call Algolia under certain conditions

I’m using the query-parameters in attributes in order to pass some filters to Algolia. I am using a reactive attributes to be able to change the query parameters.

<ais-index :query-parameters="param" app-id="latency" api-key="qq" index-name="movies">

[…]

...
  data() {
    return {
      param: {}
    }
  },
  
  mounted() {
    // typically perform ajax call
    this.param = { filters: 'genre:drama' };
    
  }

In my actual app I’m call the my backend to be able to update the params.

Algolia will before a first call without the filters then when the params are updated, another call is performed. Since the ajax call is slow it creates a flickering effect.

I’d like to avoid the first call.

Here is a working example (it’s too fast so you’ll have to look at the XHR calls). https://codepen.io/julienbourdeau/pen/YQYZQw

[rayrutjes]

Ok, so in that case, you must indeed call stop() on the store and call start() once you get your data.

Internally the store keeps a counter of the number of times it was “stopped”, in a way that any part of your code can control wether to freeze or not the syncing with Algolia.

Here is a POC (not tested and jsfiddle doesn’t like es6 import but it gives you the main idea): https://jsfiddle.net/hmg1f15k/2/

Let me know if that doesn’t work/help @julienbourdeau

[rayrutjes]

This is documented here: https://community.algolia.com/vue-instantsearch/getting-started/search-store.html#understanding-how-the-search-store-synchronizes-with-algolia