Notikumu apstrādes funkciju pievienošana Vue

Tagad palaidīsim mūsu metodi kādam notikumam. Lai pievienotu notikumu kādam DOM elementam, jāizmanto direktīva v-on.

Šajā direktīvā pēc kola jānorāda notikuma nosaukums, un vērtībā - metodes nosaukums, kas jāizsauc, kad šis notikums notiek.

Izmēģināsim praksē. Pieņemsim, ka mums ir šāda metode:

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

Pieņemsim, ka mums ir šāda poga:

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

Padarīsim tā, lai, noklikšķinot uz šīs pogas, tiktu izsaukta metode show:

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

Parasti visi izmanto saīsināto variantu v-on. To attēlo simbols @ pirms notikuma nosaukuma:

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

Izveidojiet pogu, uz kuras noklikšķinot caur alert tiks izvadīts pašreizējais datums.

Modificējiet iepriekšējo uzdevumu tā, lai alert izvadītos nevis noklikšķinot, bet gan, novadot peli virs tās.