Forward and Backward of Vue Route
this.$() // Return to the previous levelthis.$(-1) // It also returns to the previous level. 1 means forward -1 is back to the next level -2 is back to the next level.this.$("aa") // Routing forward aaIt's a routecode
Browser refresh and fallback
(parameter) // true is forced refresh is equivalent to Ctrl+F5 false refresh is equivalent to F5 = "" // The address equivalent to the browser address bar, can also be used to jump page () // Back(-1) // Back (1) // go ahead() // go ahead (0) // refresh() // refresh
The principle of routing in vue
In hash mode
<body> <!-- router-link --> <a href="#/" rel="external nofollow" >Home</a> <a href="#about" rel="external nofollow" >About</a> <!-- router-view --> <div ></div> </body>
<script> // How is the original routing code implemented // In hash mode // Listen to the browser's hashchange method, get the corresponding path, and render the corresponding components; ('DOMContentLoaded',()=>{ = (1); }) ('hashchange',() => { ('hashchange'); = (1); })
In history mode
// In history mode// If you don't use the a tag, use the span element// pushState in h5function routerChange(pathname){ (null,null,pathname) = ; } ('popstate',()=>{ = ; })
The difference between the two:
The #url will change through the anchor point, the browser can move forward and backward, the browser will keep refreshing, and not communicate with the server side (mainly through hash)
No anchor point and no hash, server-side cooperation is required
Summarize
The above is personal experience. I hope you can give you a reference and I hope you can support me more.