Dynamic query in Vue Router gives an error

Question

I want to use a dynamic query in vue router but I'm getting an error.

Code:

let selected = this.currentPage;
this.$router.replace({name: '', query: {...this.$route.query, page: selected }});

Error in console:

Navigating to current location ("/?page=5") is not allowed

I have tried the solution here How can I change only specific query params in current route vue-router? but it doesn't work

Answer 1

Likely you try to redirect to the same page. To prevent this try something like this

let selected = this.currentPage;
if (selected !== this.$route.query.page)
  this.$router.replace({name: '', query: {...this.$route.query, page: selected }});