javascript - 使用 html5 历史记录 API 和 Vue

Question

我遇到了一个愚蠢的问题。在网络应用程序中(我的堆栈是 vue + vuex + vue-router)我完全无法将我的商店状态与用户正在查看的页面同步。

当用户触发后退或前进按钮时，它会触发相同的 onpopstate 事件，该事件绝对不提供有关“方向”或页数的信息。只有状态对象中的数组key似乎几乎无法工作(去新地方时保存它，然后猜测用户去了popstate的哪里)，但我什至不知道“门”对应的位置为“关键”。

因此，从那里我考虑手动跟踪历史状态键并猜测用户去过哪里，但我想它不会交叉兼容，而且需要提升大量代码。

这是我的问题:我是否缺少 html5 API 中的一些关键元素，我该怎么做(并保持代码/逻辑简约)？

提前谢谢您!

编辑:重命名标题并添加信息

编辑2:vuex-router-sync是不合适的，因为它只在vuex端提供路由信息，并且没有真正同步路由器状态和存储状态......很糟糕

P.S.:请不要c/p定义，仔细阅读，思考

Answer 1

onpopstate在 event.state 中提供与应用程序历史记录中相应位置相关的状态对象。

编写您的应用程序，以便提供的状态对象包含应用程序的整个状态，无论时间如何。我建议您阅读 State pattern ，并理解“状态”的含义，例如

the particular condition that someone or something is in at a specific time.

我的意思是，您不需要知道您的应用程序在历史记录中的相对位置，因为 event.state 应该是您的所有应用程序需要以确定要渲染的内容。