Large Application Patterns with Vuex Chapter 18The heart module is like this; put it before the store declaration:
const heart = {
state: { loves: undefined },
mutations: {
love (state, target) {
state.loves = target
},
unlove (state) {
state.loves = undefined
}
}
}Note how the state passed inside the mutations is not the root state, but the local state of the
module.
Then comes the brain, which is divided into the left and right lobes; write the following
before the store:
const brain = {
modules: {
left: leftLobe,
right: rightLobe
}
}You can implement them as simple Boolean states (write them before the brain on which
they depend):
const leftLobe = {
namespaced: true,
state: { reason: true },
mutations: {
toggle (state) { state.reason = !state.reason }
}
}
const rightLobe = {
namespaced: true,
state: { fantasy: true },
mutations: {
toggle (state) { state.fantasy = !state.fantasy }
}
}