Coming from AngularJS I thought this would be easy enough in Vue.js 2 as well. But it seems this is difficult by design in Vue.
In AngularJS I can do this $location.search('my_param', null);
which will effectively turn https://mydomain.io/#/?my_param=872136
into https://mydomain.io/#/
.
In Vue I have tried this.$router.replace('my_param',null);
, but it will only do https://mydomain.io/#/?my_param=872136
-> https://mydomain.io/#/my_param
, leaving the empty my_param.
Isn´t there anyway in Vuejs2 to remove the query params from the Url? Should I resort to plain JS to achieve this?
In the case that you have multiple query parameters the correct way to remove one of them would be:
const query = Object.assign({}, this.$route.query);
delete query.my_param;
this.$router.replace({ query });
router.replace()
is to navigate by removing the current URL from the browser history stack and replace it with the argument route you pass to it.
The actual syntax is router.replace(url_location, onComplete, onAbort)
.
What you are doing is router.replace(my_param, null)
which is removing the current URL from the history stack and replacing it with 'my_param'
and for the onComplete
callback you are passing a null
So do it like this:
this.$router.replace('/')
More info on programatic navigation
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With