Mesélj a Vuex mutációiról.

A Vuex mutációk az egyetlen módja annak, hogy megváltoztassuk a tároló állapotát. Szinkron módon működnek, és az állapot (state) első argumentumként kerül átadásra. A második argumentum lehet egy payload objektum.

A mutations objektumban vannak definiálva a modul vagy a gyökér tárolóban. A commit módszerrel hívhatók meg.

// Mutáció definiálása
const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
    increment (state) {
      state.count++ // Állapot módosítása
    },
    incrementBy (state, payload) {
      state.count += payload.amount // Állapot módosítása payload-dal
    }
  }
})

// Mutáció hívása
store.commit('increment')
store.commit('incrementBy', { amount: 10 })

Főbb pontok:

• Szinkron: Minden mutáció szinkron módon hajtódik végre, ez garantálja az állapotváltozások kiszámíthatóságát.
• Csak mód: Csak a mutációk módosíthatják közvetlenül az állapotot.
• commit: A mutációk hívásához a store.commit() módszert használjuk.
• Payload: A mutáció elfogadhat egy második argumentumot - payload, további adatokkal.
• Nyomon követés: A Vuex Devtools követi az összes végrehajtott mutációt, megkönnyítve a hibakeresést.

Különbségek az akciókkal (actions):

• Szinkron vs Aszinkron: A mutációk szinkron, az akciók tartalmazhatnak aszinkron műveleteket.
• Közvetlen állapot módosítás vs Mutációk elkötelezése: A mutációk közvetlenül módosítják az állapotot, az akciók elkötelezik a mutációkat.

Jellemző	Mutációk	Akciók
Szinkron	Szinkron	Aszinkron lehetnek
Állapot módosítás	Közvetlenül módosítják az állapotot	Mutációk elkötelezése
Hívás	store.commit()	store.dispatch()
Cél	Állapot írása	Üzleti logika, aszinkron műveletek