javascript - 为什么在使用相同的 location.href(或空)推送时 window.onpopstate 上的 event.state 为空

Question

在不更改 URL 的情况下推送到历史记录并设置数据时:

window.history.pushState({
    stateName: "myStateName", 
    randomData: window.Math.random()
}, "myStateName", location.href);

....然后监听弹出事件并通过按下浏览器中的返回按钮触发它:

window.onpopstate = function(event) {
  console.log(event.state); //logs null
}

大多数时候你会得到 null 作为状态值而不是:

{
    stateName: "myStateName", 
    randomData: 0.34234234234
}

我该如何解决这个问题，为什么会发生这种情况？

Answer 1

这是一个奇怪的问题，根据我的说法，它没有足够的记录。在寻找这个问题的解决方案时，我遇到了很多麻烦。经过一个小时沮丧的谷歌搜索并尝试/提出不同的解决方案后，我注意到当我将状态推送两次(或更多)时它开始工作。很明显，event.state 指的是被推送的倒数第二个状态。

所以让这项工作的答案是推两次，听一次。

window.history.push(..);
window.history.push(..);

我希望这对某人有帮助!