VueJS : Dynamically change the URL depending on filters

Question

I have a project for which I use VueJS (2.x) for the frontend part. I've made a component to do some filtering :

And I'd like to be able to change the URL according to the filters, so that I can share the URL and another user would land on the same search. At the stage of my screenshot, the URL should look like : my/long/url?username=test&email=@test. But I don't know how to achieve it.

Currently, when I add/remove a filter, I create a new URLSearchParams object that I commit to the vuex store and with a watch statement I query my backend again with the updated filters.

The thing is that my URL doesn't change, of course, because I do not pass by a this.$router.push(...) or whatever.

Maybe I started it wrong.

What is the good way of achieving this ? Knowing that routing to the same view with a new query part does trigger the error DuplicateNavigation...

Thanks in advance for your help :)