Vue-da wakalary ýagtyzmak
Bildigiňiz ýaly, maglumatlar ata-enadan çagalyk komponentlerine tarap hereket edýär. Indi bolsa çagalyk komponentleriniň ata-ena komponentleri bilen nähili aragatnaşyk edýändigine seredeliň. Bu wakalary ýagtyzmak arkaly amala aşyrylýar. Geliň amalyýetde göreliň.
Ata-enanyň komponentinde käbir usul bardyr diýeliň:
methods: {
func() {
alert('xxx');
}
}
Bu usuly çagalyk komponentine parametr hökmünde geçireliň:
<template>
<User @show="func" />
</template>
Ýagtyzylýan wakany emits sazlamasynda belgileliň:
export default {
emits: ['show'],
data() {
return {
}
}
}
Indi çagalyk komponentinde basylanda işlenjek düwmäni düzeliň:
<template>
<button @click="handle">düwme</button>
</template>
Basylyş işleýjisini düzeliň:
methods: {
handle() {
}
}
Indi basylyş işleýjisinde ata-enanyň usulynyň çagyrylmagyny tabşyralyň.
Bunyň üçin $emit funksiýasyny ulanyp waka ýagtyzmaly, onuň parametri hökmünde ýagtyzylýan wakanyň adyny görkezmeli:
methods: {
handle() {
this.$emit('show');
}
}
Çagalyk komponentine iki sany funksiýa geçiriň. Çagalyk komponentinde iki sany düwme düzüň, olaryň hersiniň biri geçirilen funksiýalardan birini çagyrsyn.