vue.js - 如何让 vue DevTools 自动提交 vuex 突变？

Question

我看到了这些突变：

但只有当我单击向下箭头时，他们才会真正承诺。我怎样才能让他们随着应用程序的进展而自动提交？

Answer 1

向下箭头（标记为“全部提交”）仅在开发工具的 Vuex 历史记录中“提交”突变。此突变历史允许您检查单个突变和应用它们时的状态。它只是带有状态快照的调试辅助工具。

单击“全部提交”只是将所有突变历史压缩到一个新的“基本状态”中。换句话说，如果它对您的需求来说太长，它会丢弃突变历史。然而，这与在 Vuex 存储中提交突变无关。Vuex 存储总是包含最新的状态，包括所有的变化。

所以真的我看不到自动点击向下箭头的意义，因为那只是调试信息，应该根据需要明确控制。

Answer 2

我也遇到了这种行为。我不知道这是否适用于您的问题，但是当我确实找到了解决方法时，我想我会在这里提及它以供将来使用。

Any是根据Vuex 实例的Vuex getters特定对象计算的。确定它所基于state的对象，并且仅在它所基于的对象之一以某种方式被修改时才更新。这样做是出于性能原因，因此您不必在每次更改任何状态值时都重新计算所有 getter。getterstatestate

在我的例子中，突变修改了初始化 getter 时不存在的属性。因此 Vue 实例不知道需要更新 getter。通过将突变重置为新Base State的，getter 然后认识到它确实应该基于此属性，然后在属性更改时进行响应式更新。

这个问题是通过在一开始就将 recalcitrant 属性添加到 Vuexstate实例中来解决的，以便getter在属性更改时进行更新。

如此处所述

由于 Vue 不允许动态添加根级响应式属性，因此您必须通过预先声明所有根级响应式数据属性来初始化 Vue 实例，即使是空值也是如此。

还有这里：

理想情况下，尝试使用所有需要的字段预先初始化您的状态。

希望这对某人有帮助！