Solution for Vue Component Navigation Fails After $router.replace
is Given Below:
I have a Vue component where a user can edit or remove items. If the item count ever goes to zero, do a
this.$router.replace("routeName") to show the next view.
The issue I’m having is that clicking our built in back button (calls
this.$router.go(-1)) or the browser back button (Firefox/Chrome) changes the route in the browser address input, but does not show the expected component in the router view.
Edit: It may be an issue with the browsers and caching? Doing a hard refresh (and deleting the cache) in Chrome, and deleting all cached objects in Firefox seems to resolve the issue.
You might want to use
$router.push() instead, because
replace() doesn’t add an entry to the history. Therefore the previous route might be a different one than expected which leads to that faulty behaviour.