How can I go back route-back on vue-router

Question

Ok  to explain this simply   I have 3x pages    Page 1  Home  Page 2  Menu  Page 3  About    Page 1 has a-    lt router-link  to   menu  gt    button that when clicked routes to   menu    For now  Page 2  Menu  has a    lt router-link  to     gt    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

User · Answer

Use router back   directly to go back route-back programmatic on vue-router

User · Answer

If you re using Vuex you can use https   github com vuejs vuex-router-sync  Just initialize it in your main file with   import VuexRouterSync from  vuex-router-sync   VuexRouterSync sync store  router     Each route change will update route state object in Vuex  You can next create getter to use the from Object in route state or just use the state  better is to use getters  but it s other story https   vuex vuejs org en getters html   so in short it would be  inside components methods values    this  store state route from fullPath   You can also just place it in  lt router-link gt  component    lt router-link  to    path   store state route from fullPath    gt     Back   lt  router-link gt    So when you use code above  link to previous path would be dynamically generated

User · Answer

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    lt a  click   router go -1   gt back lt  a gt

User · Answer

Another solution is using vue-router-back-mixin  import BackMixin from  vue-router-back-mixin   export default           mixins   BackMixin     methods         goBack           this backMixin handleBack

User · Answer

This works like a clock for me   methods     hasHistory      return window history length  gt  2       Then  in the template    lt button    type  button         click  hasHistory           router go -1          router push       class  my-5 btn btn-outline-success  gt  amp laquo     Back  lt  button gt

[javascript] How can I go back/route-back on vue-router?

Examples related to javascript

Examples related to webpack

Examples related to vue.js

Examples related to vuejs2

Examples related to vue-router