Estoy aprendiendo VueJS y Vuex y trato de hacer un pequeño juego de administración con una tienda Vuex.

Tengo 100 alimentos en la tienda y todos los días, mis cuatro Peones necesitan comer 1 unidad de alimento.

Así que miro la tienda para la hora de comer en mi componente Peon.vue, del cual existen cuatro instancias:

 store.watch((state) => { if (state.time.hours === this.mealTime) { store.commit("mealTime"); } });

Y en mi tienda index.js, la confirmación hace esto:

 mealTime(state) { state.ressources.food = { ...state.ressources.food, quantity: state.ressources.food.quantity - 1, } }

Me he dado cuenta de que no funciona cuando tengo más de 1 commit al mismo tiempo (¿imagínate que 2 peones comen a las 7 am?!). Va en un bucle infinito y el mensaje:

 Maximum recursive updates exceeded. This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself. Possible sources include component template, render function, updated hook or watcher source function.

Podría olvidarme de este problema y hacerlos comer en otro momento, pero supongo que tendré este problema en otras situaciones.

¿Cómo puedo manejar varias confirmaciones al mismo tiempo? ¿Debo usar Acciones? Si debo usar acciones, ¿es posible "encadenar" una confirmación una tras otra?

Gracias por tu ayuda