Ok, to explain this simply:
I have 3x pages.
Page 1 has a-
<router-link to="/menu">
button that when clicked routes to "/menu".
For now, Page 2 (Menu) has a
<router-link to="/">
button and when this button is clicked it reverts to the previous location "/" Page 1 (Home).
But I don't want to create a component for router for each page to 'go back' to the previous page (as if I had 100 pages this could be a lot of work routing back). Is there a way to do this with vue-router? similar to window.history.back()
Curious to see if there is a way to do this as I can't find it in the docs.
Thanks in advance! John
You can add a meta feild to that route you want to conditionally disable it like this: export const routes = [ {path: '/', component: foo}, {path: '/bar', component: bar, meta:{conditionalRoute:true}} ];
The default mode for vue-router is hash mode - it uses the URL hash to simulate a full URL so that the page won't be reloaded when the URL changes. To get rid of the hash, we can use the router's history mode, which leverages the history.
To listen for route change events with Vue. js and Vue Router, we can watch the $route object in our component. to watch the $route in our component. We set deep to true to watch for all changes in the $route object's contents.
You can use Programmatic Navigation. In order to go back, you use this:
router.go(n)
Where n
can be positive or negative (to go back). This is the same as history.back()
.So you can have your element like this:
<a @click="$router.go(-1)">back</a>
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