Αναφέρετε τον κύκλο ζωής ενός στοιχείου Vue.

Ο κύκλος ζωής ενός συστατικού Vue είναι η ακολουθία των σταδίων που περνά ένα συστατικό από τη δημιουργία μέχρι την καταστροφή. Τα βασικά στάδια του κύκλου ζωής και τα αντίστοιχα hooks:

1. Δημιουργία (Creation)

   • beforeCreate — αρχικοποίηση, δεδομένα και γεγονότα ακόμα δεν είναι διαθέσιμα.
   • created — δεδομένα και μέθοδοι ήδη διαθέσιμα, αλλά το DOM δεν έχει ακόμη προσαρτηθεί.

2. Τοποθέτηση (Mounting)

   • beforeMount — πριν από την τοποθέτηση στο DOM.
   • mounted — το συστατικό έχει τοποθετηθεί, μπορεί να εργαστεί με το DOM.

3. Ενημέρωση (Updating)

   • beforeUpdate — πριν από την ενημέρωση δεδομένων και την επανασχεδίαση.
   • updated — μετά την ενημέρωση του DOM.

4. Αποσύνδεση (Unmounting)

   • beforeUnmount — πριν από την αφαίρεση του συστατικού.
   • unmounted — μετά την αφαίρεση του συστατικού από το DOM.

Αυτά τα hooks επιτρέπουν την εκτέλεση κώδικα σε συγκεκριμένες στιγμές, π.χ., αρχικοποίηση δεδομένων, εγγραφή σε γεγονότα, απελευθέρωση πόρων.

Παράδειγμα χρήσης ενός hook:

export default {
  mounted() {
    console.log('Το συστατικό έχει τοποθετηθεί');
  },
  beforeUnmount() {
    console.log('Το συστατικό θα αφαιρεθεί');
  }
}