Hogyan lehet adatokat vagy módszereket átadni egy gyermekkomponenstől a szülő komponenshez Vue-ban?

A Vue.js-ben az esemény mechanizmus általában az adatok továbbítására vagy a gyermekkomponensből a szülőkomponenshez való metódushívásra szolgál.

A gyermekkomponens $emit segítségével küldhet egy eseményt a szükséges adatokkal, a szülőkomponens pedig figyeli ezt az eseményt és reagál rá.

Példa:

<!-- Szülő komponens -->
<template>
  <ChildComponent @custom-event="handleCustomEvent" />
</template>

<script>
import ChildComponent from './ChildComponent.vue';

export default {
  components: { ChildComponent },
  methods: {
    handleCustomEvent(payload) {
      console.log('Gyermek által küldött adatok:', payload);
    }
  }
}
</script>

<!-- Gyermek komponens -->
<template>
  <button @click="sendData">Adatok küldése a szülőnek</button>
</template>

<script>
export default {
  methods: {
    sendData() {
      this.$emit('custom-event', { message: 'Szia, szülő!' });
    }
  }
}
</script>

Így a gyermekkomponens nem hívja közvetlenül a szülő metódusait, hanem egy eseményt jelez, és a szülő dönt arról, mit tegyen vele. Ez támogatja az egységirányú adatáramlás elvét és egyszerűsíti az állapotkezelést.