Vue-те оқиғалар өндеушілерін қосу

Енді біздің әдісімізді қандай да бір оқиға бойынша іске қосаық. Кез келген DOM элементіне оқиғаны қосу үшін v-on директивасын қолдану керек.

Бұл директивада қос нүктеден кейін оқиға атауын көрсету керек, ал мәні ретінде - осы оқиға орын алған кезде шақырылатын әдістің атауы.

Практикада көрейік. Бізде келесі әдіс бар делік:

methods: {
	show: function() {
		alert('!');
	}
}

Бізде келесі түйме бар делік:

<template>
	<button>text</button>
</template>

Осы түймені басқан кезде show әдісі шақырылсын делік:

<template>
	<button v-on:click="show">text</button>
</template>

Әдетте барлық v-on қысқартылған нұсқасын қолданады. Ол оқиға атауының алдында @ таңбасын білдіреді:

<template>
	<button @click="show">text</button>
</template>

Басу кезінде alert арқылы ағымдағы күн шығарылатын түйме жасаңыз.

Алдыңғы тапсырманы түрлендіріп, alert басу кезінде емес, тышқанды апару кезінде шығарылсын.