[极致用户体验] 网页里的「返回」应该用 history.back 还是 push ？

我是HullQin，公众号线下聚会游戏的作者（欢迎关注公众号，发送加微信，交个朋友），转发本文前需获得作者HullQin授权。我独立开发了《联机桌游合集》，是个网页，可以很方便的跟朋友联机玩斗地主、五子棋等游戏，不收费没广告。还开发了《Dice Crush》参加Game Jam 2022。喜欢可以关注我 HullQin 噢～我有空了会分享做游戏的相关技术。

1. 什么是「返回」按钮？

这里不是浏览器的「返回」按钮，我们没办法修改它的行为。

而是网页代码中的「返回」按钮，我们可以定义它的行为。

举个例子

比如我的五子棋小游戏：

点开链接，会出现文章开头图片的的页面——游戏主页，「进入房间」后，左上角有个「离开房间」按钮，点击后，会返回主页。

这种需要返回上层页面的按钮，在本文中，称之为「返回」按钮。

2. 什么是 push、back、replace？

	push	back	replace
浏览器行为	页面会发生跳转，并在当前浏览记录新增一条记录（之后你可以按浏览器「返回」，回到跳转前的页面）。	页面返回上一条浏览记录（之后你可以按浏览器「前进」，重新回到返回前的页面）。若浏览器没有上一条记录，则什么都不会发生。	页面会发生跳转，覆盖当前的浏览记录。（你按浏览器「返回」，无法回到跳转前的页面）
HTML DOM API: History	History.pushState()	History.back()	History.replaceState()
history@4 或 React Router@4或@5	history.push()	history.goBack()	history.replace()
React Rout