My NuxtJS website has a Vuex store with a root state and a module located at store/shop/cart/state.ts
. Within the module, there is a file called store/shop/cart/mutations.ts
.
import { MutationTree } from 'vuex';
import { CartState } from './state';
import { Cart } from '~/types/Cart';
export enum CartMutations {
SET_CART = 'SET_CART',
}
const mutations: MutationTree<CartState> = {
[CartMutations.SET_CART](
state: CartState,
payload: { cart: Cart }
) {
state.cart = payload.cart;
},
};
export default mutations;
In my middlewares
, I want to commit the mutation like this.
store.commit(CartMutations.SET_CART, cart);
However, because of namespacing, the action is named shop/cart/SET_CART
. This forces me to use a different syntax that does not utilize the enum.
store.commit('shop/cart/SET_CART', cart);
Has anyone else encountered this issue? I'm looking for a clean solution to work around it while maintaining namespaces.