[Vuejs]-Nuxt modules state

by

0👍

You don’t need the ‘modules’ folder at all. Nuxt is clever enough to puzzle together your store from the files and directory structure. So, your example could be like this:

  • Dir: store
    • state.js, mutations.js, actions.js, getters.js
    • Dir: posts
      • state.js, mutations.js, actions.js, getters.js

Note that you don’t need the index.js files either! In fact, if your store doesn’t have a specific root state, then no need to have the files under the store directory.

The docs are a bit vague on what should be in each file. Here is a quick guide:

state.js
export default () => ({
  field1: 'init value',
  field2: 'init value'
})

mutations.js
export function mutation1(state, payload) {...}
export function mutation2(state, payload) {...}

getters.js
export getter1(state, getters, rootState, rootGetters) {...}
export getter2(state, getters, rootState, rootGetters) {...}

actions.js
export action1(context, payload) {...}
export action2(context, payload) {...}

Leave a comment