Bug with query history in vue history-router?

Trying to use browser url sync from example, its working fine inside your sandbox, but it use old versions, and it generate url like ?query=test, if I use same example with new versions, it generate - ?query%5B0%5D=t&query%5B1%5D=e&query%5B2%5D=s&query%5B3%5D=t

And if I reload page wit this query - I got [object Object] and error in console - [Vue warn]: Invalid prop: type check failed for prop "value". Expected String with value "[object Object]", got Object found in <SearchInput>

It seems like a bug for me, I can repeat it in sandbox just updated libraries to actual.

I did not find a solution for this url issue, can you help or fix it?

Hi, could you clarify which versions you’ve updated? Note that Vue InstantSearch is only compatible with v3 of InstantSearch, not v4 for now.

Works fine with version 3.7.0, thanks.

1 Like

Do you have plans upgrade to v4?

Sorry for not replying earlier, but the next version of Vue InstantSearch is out with InstantSearch v4 inside: Vue InstantSearch v3 has been released! 👓③🆕

Another problem for now, when I migrate to version 4.7.0 and change stateMapping to singleIndexMapping - url didn`t change for now, if I return to simpleStateMapping - url changed, but same bug with object.

Can you help with it?

Hi @dev22

Can you check my example to see what’s different from yours?

      routing: {
        router: historyRouter(),
        stateMapping: singleIndexMapping('instant_search'),
      },

Please be aware that you need to put your index name to singleIndexMapping.

Thank you, problem solved when I set same dependencies as in your example, with one difference - upgrade algoliasearch to 4.3.0

Glad to hear that. Let us know if you stumble upon any other issue.