Oddajanje dogodkov v Vue

Kot že veste, se podatki premikajo od starševskih komponent k podrejenim. Poglejmo zdaj, kako lahko podrejene komponente komunicirajo s starševskimi. To naredimo z oddajanjem dogodkov. Poglejmo v praksi.

Recimo, da ima starševska komponenta določeno metodo:

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

Posredujmo to metodo kot parameter v podrejeno komponento:

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

Določimo oddani dogodek v nastavitvi emits:

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

Naredimo zdaj v podrejeni komponenti gumb, ki bo obravnaval klik nanj:

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

Naredimo ročje klik:

methods: {
	handle() {
		
	}
}

Zdaj v ročju klik naredimo, da se pokliče starševska funkcija. Za to oddajmo dogodek s funkcijo $emit, kot parameter podajmo ime oddanega dogodka:

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

Posredujte v podrejeno komponento dve funkciji. Naredite v podrejeni komponenti dva gumba, vsak od katerih bo poklical eno od posredovanih funkcij.