[Vuejs]-Vue router.replace acts differently based on how input object is assembled

by

0👍

✅

In your second code, you’re mutating the this.$route.query object directly and passing it to this.$router.replace. I’m guessing vue-router will not be able to detect if the query has changed because you mutated vue-router’s internal state.

Do not mutate the this.$route object (or any of Vue’s internal state for that matter) otherwise things may not work properly.

If you want to preserve the existing query parameters while introducing or changing another one, then you can do this:

this.$router.replace({
  query: Object.assign({}, this.$route.query, { locale: newLocale }),
  // No need to specify route name and params, they will be preserved
});

Leave a comment