I get many "indexName is not valid" after adding ais-sort-by component

After creating two replicas for my index:

  • cars_price_desc
  • cars_price_asc

I added the ais-sort-by component to my app, this way:

<ais-sort-by
    :items="[
        { value: 'cars', label: 'Sort by ...' },
        { value: 'cars_price_desc', label: 'Price desc.' },
        { value: 'cars_price_asc', label: 'Price asc.' },
    ]"
></ais-sort-by>

And I get a lot of errors in the console, with queries without the index name:

image

As you can see, in the request the indexName is empty.

I have no idea why this is happening.
Thanks.

Hi @sassaroli,

Can you add this to one of the codesandboxes you’ve started?

Can you confirm which API client you are using?

Yes, I’m trying to duplicate this in a new codesandboxes, but I can’t.
Is working in the codesandboxes.
I will let you know when I get it.
Thanks !

I fond what is causing the problem.
I was using code splitting and lazy load, to load some components, and that was causing the error

'ais-mile-range-slider': () => import(/* webpackChunkName: "js/chunk/aisMileRangeSlider" */'./aisMileRangeSlider.vue'),
'ais-price-range-slider': () => import(/* webpackChunkName: "js/chunk/aisPriceRangeSlider" */'./aisPriceRangeSlider.vue'),
'ais-year-range-slider': () => import(/* webpackChunkName: "js/chunk/aisYearRangeSlider" */'./aisYearRangeSlider.vue'),
'ais-custom-hits': () => import(/* webpackChunkName: "js/chunk/aisCustomHits" */'./aisCustomHits.vue'),
'ais-custom-current-refinements': () => import(/* webpackChunkName: "js/chunk/aisCustomCurrentRefinements" */'./aisCustomCurrentRefinements.vue'),

I changed for the required method, and now is working.

'ais-mile-range-slider': require('./aisMileRangeSlider.vue').default,

Maybe there is a way to load this async?

Thanks

I’m still getting this error when I change two fields into my search panel.
I can’t duplicate the problem in codesandbox, and is breaking my entire app.
Distance from you is binding the value to aroundRadius: this.geoLocation.aroundRadius
How we can work on this? Please, I need some help.

And this only happens when I add the soty by component. And the app start working with multiple index, or replicas (I think)

After adding the default: true to the default value in the array, and remove it from inline, and added to the data of component, everything work just fine.
Thanks @Haroenv