如何知道是否按下了前进/后退按钮而不是在vue / vue-router中手动推动了路由器？

Question

在vue / vue-router中，我在AuthenticationProvider上有一个观察者，它有两种触发方式。

1. 我在浏览器上单击后退或前进。
2. 用户与表单进行交互，表单上使用的变量具有监视程序，然后这些监视程序功能使用$route更新URL。

然后在$router.push的监视程序函数中，我如何知道上述两种情况中的哪一种发生了？

问题是，如果发生方案1，我想再次手动更新表单。如果情况2发生了，那么该表单将已经被更新，所以我不想再次手动更新该表单。

Answer 1

  

然后在$route的监视程序函数中，我如何知道上述两种情况中的哪一种发生了？

不能。每当观察到的值发生任何变化时，观察者都会执行，您将不知道是什么导致值在回调中发生变化。

如果您想知道由于用户单击后退/前进浏览器按钮而导致路线更改的时间，则需要为popstate事件添加事件监听器。

  

问题是，如果发生方案1，我想再次手动更新表单。如果情况2发生了，那么该表单将已经被更新，所以我不想再次手动更新该表单。

在更新任何上的表单以更改URL参数/查询中的数据时，我没有看到任何问题；您可以检查URL数据是否与表单数据相同，并跳过更新。

Answer 2

这似乎可以解决问题

window.onpopstate = function(event) {
  console.log("location: " + document.location + ", state: " + JSON.stringify(event.state));
};

它在我后退或前进时运行，而不是在我手动更新URL时运行。