Emetimi i Ngjarjeve në Vue

Siç e dini tashmë, të dhënat lëvizin nga komponentët prind në ato fëmijë. Le të shohim tani se si komponentët fëmijë mund të komunikojnë me prindërit. Kjo bëhet duke përdorur emetimin e ngjarjeve. Le ta shohim në praktikë.

Le të themi që në komponentin prind ekziston një metodë:

methods: {
	func() {
		alert('xxx');
	}
}

Le ta kalojmë këtë metodë si parametër në komponentin fëmijë:

<template>
	<User @show="func" />
</template>

Le të përcaktojmë ngjarjen e emetuar në konfigurimin emits:

export default {
	emits: ['show'],
	data() {
		return {
			
		}
	}
}

Le të bëjmë tani në komponentin fëmijë një buton, i cili do të trajtojë klikimin mbi të:

<template>
	<button @click="handle">btn</button>
</template>

Le të krijojmë një trajtues klikimi:

methods: {
	handle() {
		
	}
}

Le të bëjmë që tani në trajtuesin e klikimit të thirret funksioni prind. Për këtë, le të emetojmë ngjarjen duke përdorur funksionin $emit, duke përcaktuar si parametër të tij emrin e ngjarjes së emetuar:

methods: {
	handle() {
		this.$emit('show');
	}
}

Kaleni në komponentin fëmijë dy funksione. Bëni në komponentin fëmijë dy butona, secili prej të cilëve do të thërrasë një nga funksionet e kaluar.