Nuxt.js Vuex 模塊未按預期工作

Question

我在模塊中使用 Nuxt 的 Vuex 時遇到問題。

事實證明， state正在被聲明並出現在 Vuex 中，動作被觸發，但mutation改變了state實例，但不提交更改甚至不觸發事件，因為它沒有出現在 Vuex devtools 中控制台，在 Vuex 模塊代碼下方。

注意：在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 並在號召性用語上放置一個 await。

代碼如下：

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

希望我的回答能幫助到更多人