history.replace() Vs history.push() 区别

1. history 原理

用户访问的页面地址会保存到一个栈中 （LIFO 后进先出)

2. history 的 go()

• /home ==> /home/qa ===> /home/video
• history.go(-1) // 返回前一个页面，history.go(-2) 往前翻回第二个页面
• history.go(1) // 前进一个页面

3. history 的 replace() 和 push()

History Push: The user can go forward and backward in the browser and the url will change. It works like a programmatic link with no affect on current url.

Location Replace: The link of the page is set to the new one, but the user can’t go between the replaced.

• history.push() 页面跳转，并且往页面栈中添加一条记录
• history.replace() 页面跳转，但是不会添加一条记录，而是替换当前的记录

3.1 场景

e.g.

1. 用户已经登录，在一个社交 app,当用户点击 关注， token 过期，跳转到 /login;
2. 用户回到 关注 页面，点击关注后，用户点击 回退 按钮，如果 login页面跳转的是 replace,就会回到 关注 前面一个页面，如果 push，就会回到 login