Atașarea manipulatoarelor de evenimente în Vue

Haideți acum să rulăm metoda noastră la un eveniment. Pentru a atașa un eveniment unui element DOM, trebuie să folosiți directiva v-on.

În această directivă după două puncte trebuie să specificați numele evenimentului, iar ca valoare - numele metodei care trebuie apelată la producerea acelui eveniment.

Să încercăm în practică. Să presupunem că avem următoarea metodă:

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

Să presupunem că avem următorul buton:

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

Haideți să facem astfel încât la click pe acest buton să fie apelată metoda show:

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

De obicei toată lumea folosește varianta prescurtată a lui v-on. Acesta reprezintă simbolul @ înaintea numele evenimentului:

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

Creați un buton, la click pe care prin alert să fie afișată data curentă.

Modificați problema anterioară astfel încât alert să fie afișat nu la click, ci la trecerea mouse-ului peste.