Μίλησέ μου για τις μεταλλάξεις στο Vuex.

Οι μεταλλάξεις στο Vuex είναι ο μόνος τρόπος για να αλλάξετε την κατάσταση της αποθήκης. Είναι συγχρονες και λαμβάνουν την κατάσταση (state) ως πρώτο όρισμα. Το δεύτερο όρισμα μπορεί να είναι ένα αντικείμενο payload.

Ορίζονται στο αντικείμενο mutations του μονάδας ή της ρίζας αποθήκης. Καλούνται με τη μέθοδο commit.

// Ορισμός μετάλλαξης
const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
    increment (state) {
      state.count++ // Αλλαγή κατάστασης
    },
    incrementBy (state, payload) {
      state.count += payload.amount // Αλλαγή κατάστασης με payload
    }
  }
})

// Κλήση μετάλλαξης
store.commit('increment')
store.commit('incrementBy', { amount: 10 })

Βασικά σημεία:

• Συγχρονες: Όλες οι μεταλλάξεις εκτελούνται συγχρονως, διασφαλίζοντας την προβλεψιμότητα των αλλαγών κατάστασης.
• Μόνο τρόπος: Μόνο οι μεταλλάξεις μπορούν να αλλάξουν άμεσα την κατάσταση.
• commit: Για να καλέσετε μεταλλάξεις, χρησιμοποιείται η μέθοδος store.commit().
• Payload: Η μετάλλαξη μπορεί να δεχτεί ένα δεύτερο όρισμα - payload, που περιέχει πρόσθετα δεδομένα.
• Παρακολούθηση: Τα Vuex Devtools παρακολουθούν όλες τις πραγματοποιημένες μεταλλάξεις, διευκολύνοντας το debugging.

Διαφορές με τις ενέργειες (actions):

• Συγχρονες vs Ασύγχρονες: Οι μεταλλάξεις είναι συγχρονες, οι ενέργειες μπορούν να περιέχουν ασύγχρονες λειτουργίες.
• Άμεση αλλαγή κατάστασης vs Commit μεταλλάξεων: Οι μεταλλάξεις αλλάζουν άμεσα την κατάσταση, οι ενέργειες commit μεταλλάξεις.

Χαρακτηριστικό	Μεταλλάξεις	Ενέργειες
Συγχρονες	Συγχρονες	Μπορούν να είναι ασύγχρονες
Αλλαγή κατάστασης	Αμεση αλλαγή κατάστασης	Commit μεταλλάξεων
Κλήση	store.commit()	store.dispatch()
Σκοπός	Καταγραφή κατάστασης	Επιχειρηματική λογική, ασύγχρονες λειτουργίες