Vue-da hodisalarni chiqarish
Siz allaqachon bilasizki, ma'lumotlar ota-komponentlardan farzand komponentlariga o'tadi. Keling, endi farzand komponentlari ota komponentlar bilan qanday muloqot qilishini ko'ramiz. Bunga hodisalarni chiqarish orqali erishiladi. Keling, amalda ko'ramiz.
Faraz qilaylik, ota komponentda quyidagi metod mavjud:
methods: {
func() {
alert('xxx');
}
}
Keling, ushbu metodni parametr sifatida farzand komponentiga o'tkazamiz:
<template>
<User @show="func" />
</template>
Keling, chiqariladigan hodisani
emits sozlamasida belgilaymiz:
export default {
emits: ['show'],
data() {
return {
}
}
}
Keling, endi farzand komponentida ustiga bosilganda ishlov beradigan tugma yarataylik:
<template>
<button @click="handle">btn</button>
</template>
Keling, bosish uchun ishlovchini yaratamiz:
methods: {
handle() {
}
}
Keling, endi bosish ishlovchisida
ota metodining ishlashiga majbur qilaylik.
Buning uchun $emit funksiyasidan foydalanib
hodisa chiqaramiz, uning parametrida
chiqarilayotgan hodisa nomini ko'rsatamiz:
methods: {
handle() {
this.$emit('show');
}
}
Farzand komponentiga ikkita funksiyani o'tkazing. Farzand komponentida ikkita tugma yarating, ularning har biri o'tkazilgan funksiyalardan birini chaqirsin.
