Vuex行动与变异

因为没有状态就没有突变！提交后，将执行一条以可预见的方式更改状态的逻辑。突变是设置或更改状态的唯一方法（因此，没有直接的更改！），此外，它们必须是同步的。该解决方案提供了非常重要的功能：变异正在登录devtools。这为您提供了出色的可读性和可预测性！

还有一件事-行动。就像人们所说的那样，动作会引起突变。因此，它们不会更改存储，因此不需要同步它们。但是，他们可以管理额外的异步逻辑！

变异：

Can update the state. (Having the Authorization to change the state).

动作：

Actions are used to tell "which mutation should be triggered"

以Redux方式

Mutations are Reducers
Actions are Actions

为什么都??

当应用程序增长，编码和行数增加时，那时候您必须处理Actions中的逻辑而不是突变中的逻辑，因为突变是更改状态的唯一权限，因此应尽可能保持干净。

似乎没有必要actions仅调用额外的一层mutations，例如：

const actions = {
  logout: ({ commit }) => {
    commit("setToken", null);
  }
};

const mutations = {
  setToken: (state, token) => {
    state.token = token;
  }
};

因此，如果调用actions电话logout，为什么不叫突变本身？

动作的整个想法是从一个动作内部调用多个变异，或者发出Ajax请求或您可以想象的任何一种异步逻辑。

我们最终可能会发出多个网络请求的动作，并最终调用许多不同的突变。

因此，我们尝试的东西尽可能多的复杂性，从我们Vuex.Store()尽可能在我们actions这离开我们mutations，state和getters清洁，简单，与这类模块化，使得像Vue的图书馆和应对流行的线下降。

动作和突变之间的主要区别：

1. 在内部操作中，您可以运行异步代码，但不能运行突变。因此，请对异步代码使用动作，否则请使用变异。
2. 在动作内部，您可以访问获取器，状态，突变（提交它们），动作（调度它们）以访问状态。因此，如果您只想访问状态，请使用突变，否则请使用操作。

我认为TLDR的答案是，突变是同步/事务性的。因此，如果您需要运行Ajax调用或执行任何其他异步代码，则需要在Action中执行此操作，然后在之后进行更改以设置新状态。

变异是同步的，而动作可以是异步的。

换句话说：如果操作是同步的，则不需要任何操作，否则可以实现它们。

免责声明-我只是刚刚开始使用vuejs，所以这只是我在推断设计意图。

时间机器调试使用状态快照，并显示操作和变异的时间线。从理论上讲，我们可以只actions记录状态设置器和获取器以同步描述突变。但是之后：

• 我们会有不纯的输入（异步结果），这会导致设置者和获取者。这在逻辑上很难遵循，并且不同的异步设置器和获取器可能会令人惊讶地进行交互。mutations事务仍然可能发生这种情况，但是我们可以说需要改进事务，而不是将其作为行动中的竞争条件。由于异步编程既脆弱又困难，因此动作内部的匿名突变可以更轻松地重现此类错误。
• 事务日志将很难读取，因为状态更改没有名称。它会更像代码，而英语更少，缺少突变的逻辑分组。
• 与现在同步定义差异点（在突变函数调用之前和之后）相反，用仪器记录数据对象上的任何突变可能比较棘手且性能较低。我不确定这有多严重。

将以下事务日志与命名突变进行比较。

Action: FetchNewsStories
Mutation: SetFetchingNewsStories
Action: FetchNewsStories [continuation]
Mutation: DoneFetchingNewsStories([...])

对于没有命名突变的事务日志：

Action: FetchNewsStories
Mutation: state.isFetching = true;
Action: FetchNewsStories [continuation]
Mutation: state.isFetching = false;
Mutation: state.listOfStories = [...]

我希望您可以从该示例中推断出动作内部异步和匿名突变的潜在复杂性。

https://vuex.vuejs.org/en/mutations.html

现在想象我们正在调试应用程序，并查看devtool的变异日志。对于记录的每个突变，devtool将需要捕获状态的“之前”和“之后”快照。但是，上面示例突变中的异步回调使这成为不可能：在提交突变时尚未调用该回调，并且devtool无法知道何时将实际调用该回调-回调中执行的任何状态突变本质上是不可追踪的！