• Welcome to the eight year blog, I'm glad to meet you at the right age!
  • Due to the theme, QQ login partners will display the default avatar in the comments. Please go to the personal center and upload the avatar again.

Vue back to the previous page will jump out of the site? How to jump to the home page without the previous page?

Code Notes barben 7 months ago (03-13) 712 views 1 comment

Today, when I made the back button in the upper left corner of the mobile phone, I unlocked a very desperate operation
If I directly click back to the other project page after I enter the address.
What's the difference between this and the browser's fallback function!!! Mobile terminal website is not if there is no previous page will jump back to the home page???

 //Using the Vue router's fallback methods go and back, this will happen 
 this. $router. Go (- 1); 
 this. $router. Back (- 1);

Reference ideas:
In the session storage, set a variable of type array, which is used to record the change of each route.
For each jump, the user inserts the URL of the previous page to the beginning of the array.
Each time the user clicks the back button, the page will jump to the URL at the beginning of the array, and then the URL will be deleted from the array.
So as to realize the function of returning to the previous page

be careful:
1. No matter what the URL is, as long as it is the first time to enter or refresh a page, the path attribute returning to the previous page is always' / "
2. The back button should not be set on the home page

The code is as follows

 Export default {export default {data() {data() {return return {historyurl: sessionsstorage.historyurl? Json.parse (sessistorage.historyurl): [], 
backflag: false, / / records whether this route update is the user's back-back operation ԡ} 
 methods: {goback() () {/ / / / / / the click event of the back button 
, backflag: false, / / records whether the route update is the user's back operation ԡ} 
, methods: 
 goback methods: {goback (); {/ / / / button's click event of the back button's click event 
? This.backflag = true; //Set the page Jump of this page to a backward jump, so that this jump will not be written into the historical URL record ԡ this $this $router.push (this.historyurl [0]); 
 this.historyurl.split (0,1); 
} ԡ}, 
, make this jump not be written into the historyurl record ԡ this $this $router.push (this.historyurl [0]); ԡ 
 this.historyurl. Split (0,1); 
. Backflag) {/ / the route jump is not caused by the user's active backtracking If (from. Path! = this. Historyurl [0]) {/ / avoid writing two identical URLs in succession. If (this. Historyurl. Length > 0 & & from. Path = "/") {/ / if the historical access address already has data, and the previous page is identified as "/", it is likely that the judgment of entering caused by user refresh will not be written This.historyurl = [from. Path,... This. Historyurl]; / / insert a historical access address at the beginning of historyurl 
} else {this. Backflag = false; / / this is not recorded because the user takes the initiative to back off. But restore this mark, so that the next trigger route jump can be judged normally. }


Eight blogs that year, we've been there all the time
If the author does not indicate the original article, please indicate the link and source of this article
Vue back to the previous page will jump out of the site? How to jump to the home page without the previous page? - https://www.barben.cn/code/701.html
Like it( five )
Post my comments
Cancel comment
expression Mapping Bold Strikethrough Center Italics

You need to bring your nickname and email with you in the year of eight!

  • Nickname (required)
  • Email address (required)
  • website
Successfully captured one A rare spirit
  1. Write it to the routing guard
    Gangjing 2020-03-18 12:58 reply