Where has Vue Devtools's Time Travel Debugging feature gone?

Question

It's been a while since I worked with VueJS (2 or so years ago). I wanted to get back to working on an old VueJS 2.6 app, and I'm having trouble finding the Time Travel Debugging feature of Devtools for Vuex.

Here you can see what Time Travel Debugging is supposed to look like:

But now at least with Devtools 6.1.4, I'm having trouble finding that feature. I see the Vuex state, but I can't find: the list of mutations, the state changes of the mutations, nor the ability to Time Travel between mutations. See the image below:

Where then is the Time Travel Debugging functionality?

Answer 1

Vuex 突变/操作的日志现在显示在“时间轴”选项卡上。

然而，最新版本的 Vue DevTools (6.x) 删除了 Time Travel 调试（特别是恢复到特定状态的能力）。作者在GitHub 讨论中解释了关于这个问题的原因：

这没有实现，因为开发工具的功能更改为时间线，这不仅与 Vuex 突变有关，还与来自组件、插件（例如 pinia 等）的任何其他事件有关。

让我们使用这个主题来讨论时间旅行以及它在时间轴中的外观/工作方式。

@tkuntermannpv 如果你确实需要 Vuex 时间旅行，请使用旧版本。

如前所述，您必须安装 5.x 版本的 Vue DevTools 才能使用该功能。