Vue.js Vuex State Management

import { createStore } from 'vuex';
const store = createStore({
    state() { return { count: 0 } },
    mutations: { },
    actions: { },
    getters: { }
});

state() {
    return {
        count: 0,
        user: null
    }
}
this.$store.state.count # access state

mutations: {
    increment(state) { # synchronous only
        state.count++
    },
    setUser(state, user) { # with payload
        state.user = user
    }
}
this.$store.commit('increment'); # call mutation

actions: {
    async fetchUser({ commit }) { # asynchronous
        const user = await api.getUser();
        commit('setUser', user);
    }
}
this.$store.dispatch('fetchUser'); # call action

getters: {
    doubleCount(state) { # computed state
        return state.count * 2
    }
}
this.$store.getters.doubleCount # access getter

modules: {
    user: {
        namespaced: true, # namespace module
        state: { },
        mutations: { }
    }
}