Mapeé acciones de la tienda vuex en mi componente principal ( Home ). Mi componente principal incluye un componente secundario ( Buttons ). Me gustaría pasar la acción mapeada ( decreaseAction ) de padre a hijo. Acabo de agregar el nombre de esta acción al botón (en el componente secundario) como @click="decreaseAction" . Aunque no funciona. Claro, podría usar @click="$store.dispatch('decreaseAction')" pero quería hacerlo de otra manera, pasando la acción del padre. ¿Por qué la acción no se puede pasar directamente de padre a hijo aquí?

Inicio.vue

 <template> <div class="home"> The App </div> <Buttons /> </template> <script> import { mapActions } from 'vuex'; import Buttons from '@/components/Buttons.vue'; export default { name: 'Home', methods: mapActions(['decreaseAction']), components: { Buttons } } </script>

Botones.vue

 <template> <div class="buttons"> <button @click="decreaseAction">Decrease</button> <!-- <button @click="$store.dispatch('decreaseAction')">Decrease</button> // using $store.dispatch works fine.. --> </div> </template> <script> export default { } </script>