Search code examples
vue.jsvuexstore

Vuex combining namespaced modules and constants types


i always use constants types for vuex eg.

const SET_CATEGORY = 'setCategory'

but now i want to use modules with namespace and im stuck, should i change names (for example for module 'game') to

const SET_CATEGORY = 'game/setCategory' ?

When im doing this, my mutation looks 'game/game/setCategory'.

I know why it looks like that (becouse i use same constants types to create and call mutation) but don't know how deal with it.

I can just call mutations like store.commit('game/${SET_CATEGORY}') but thats doesnt look good.

ps.Sorry for mistakes, im not native.

Cheers


Solution

  • When using namespaces you don't need to change your mutation and action names. So:

    const SET_CATEGORY = 'setCategory' //stays the same
    

    And as you correctly put, to reference this mutation in a module named 'game:

    store.commit(`game/${SET_CATEGORY}`);
    

    or

    const moduleName = 'game';
    store.commit(`${moduleName}/${SET_CATEGORY}`);