突变未提交 vuex答案

【问题标题】：mutation not commited vuex突变未提交 vuex
【发布时间】：2020-12-31 06:17:36
【问题描述】：

我正在尝试使用 nuxtServerInit 提交一个简单的突变，但我似乎做不到。

我的代码如下：


// initial state
export const state = () => ({
  number: 0
});

// getters
export const getters = {};

// mutations
export const mutations = {
  addNumber(state) {
    console.log("addNumber mutation");
    state.number++;
  }
};

// actions
export const actions = {
  async nuxtServerInit(context) {
    console.log("nuxtServerInit");
    await context.commit("addNumber");
  },
  addNumber(context) {
    console.log("addNumber action");
    context.commit("addNumber");
  }
};

export default { actions };

console.log("nuxtServerInit"); 被调用，但突变没有。

我也收到此错误：[vuex] unknown mutation type: addNumber

【问题讨论】：

你在注册突变吗？你能提供你的商店建设代码吗？
这是使用nuxt完成的，所以据我从文档中了解，存储是由nuxt自动构建的。
mutations (commits) 不是异步的，它们是同步的。只有操作 (dispatch) 是 async。事实上，这就是它们之间的主要区别。请提供一些有关您如何注册商店模块（如果它是模块）的可见性。您是否从商店中提取每个单独的导出（使用import * as someModule from './someModule' ？因为您没有在默认导出中包含mutations、getters 和state，所以import someModule from './someModule' 将只包含actions。

标签： javascript vue.js vuex nuxt.js

【解决方案1】：

您没有导出除actions 以外的任何内容。您需要导出所有四个项目。将最后一行更改为

export default {
    state,
    getters,
    actions,
    mutations
}

这将导出mutations、getters 和state 以及您的actions，您的问题将得到解决。

【讨论】：