Question

我在模块中使用Nuxt的Vuex时遇到问题。

事实证明state被声明并出现在Vuex中，触发了动作，但是mutation更改了state实例，但不提交更改并执行甚至不会触发该事件，因为该事件不会出现在Vuex模块代码下方的Vuex devtools控制台中。

注意：在两个console.log()中，状态都显示为空，第一个为声明状态，第二个为更改后的状态，但更改并未真正反映在Vuex中。

export const strict = false
export const state = () => ({
  address: {}
})

export const mutations = {
  setShopAddress(state, address) {
    console.log(state)
    state.address = address
    console.log(state)
  }
}

export const actions = {
  getAddress({
    commit
  }) {
    this.$axios
      .get('/general/address')
      .then((response) => {
        commit('setShopAddress', response.data)
      })
      .catch((e) => console.error(e))
  },
  setAddress(vuexContext, address) {
    vuexContext.commit('setShopAddress', address)
  }
}

export const getters = {
  getShopAddress(state) {
    return state.address
  }
}

Answer 1

很多小时后，多亏了Telegram上的Nuxt组，我才找到了解决方案，我只需要在nuxtServerInit上放置一个异步变量，然后等待号召性用语。

以下代码：

async nuxtServerInit({ dispatch }) {
    await dispatch('module/action')
},

我希望我的回答可以帮助更多人

Nuxt.js Vuex模块无法按预期工作

1 个答案: