Vuex商店：为什么我要使用突变？

Question

我正在使用vuex作为状态管理库来构建Vuejs应用程序。

我的商店很快就充满了可以更新商店的突变，但是我做不到两者之间的区别：

actionName({state}, value) {
  state.counter += value;
},

并执行以下操作：

actions: {
  actionName({commit}, value) {
    commit("incrementCounter", value);
  },
},
mutations: {
  incrementCounter(state, value) {
    state.counter += value;
  },
}

我应该使用哪种方法，为什么？