Ву дар Vue воқеаҳо бароридан
Чунон ки шумо аллакай медонед, маълумотҳо аз компонентҳои волидайн ба компонентҳои фарзанд ҳаракат мекунанд. Акнун биёед бубинем, ки чӣ тавр компонентҳои фарзанд бо компонентҳои волидайн муомила карда метавонанд. Ин бо воситаи бароридани воқеаҳо анҷом дода мешавад. Биёед амалан бубинем.
Бигзор дар компоненти волидайн як усули муайян мавҷуд бошад:
methods: {
func() {
alert('xxx');
}
}
Ин усулро ҳамчун параметр ба компоненти фарзанд бигузаронем:
<template>
<User @show="func" />
</template>
Воқеаи бароридашударо дар
танзимоти emits сабт кунем:
export default {
emits: ['show'],
data() {
return {
}
}
}
Акнун дар компоненти фарзанд як тугма созем, ки клик кардан ба он коркард карда шавад:
<template>
<button @click="handle">btn</button>
</template>
Коркунандаи кликро созем:
methods: {
handle() {
}
}
Акнун дар коркунандаи клик
вазифаи волидайнро иҷро кардан ҳатм кунем.
Барои ин, бо истифода аз функсияи $emit
воқеаеро барорем,
дар параметраш номи воқеаи бароридашавандаро зикр кунем:
methods: {
handle() {
this.$emit('show');
}
}
Ба компоненти фарзанд ду функсия бигузаред. Дар компоненти фарзанд ду тугма созед, ки ҳар яке аз онҳо яке аз функсияҳои гузаронидашударо даъват кунад.