Gebeurtenishanterings in Vue

Laat ons nou ons metode by een of ander gebeurtenis aktiveer. Om 'n gebeurtenis aan 'n DOM-element te koppel, moet jy die richtlijn v-on gebruik.

In hierdie richtlijn moet jy na die dubbelpunt die naam van die gebeurtenis spesifiseer, en as die waarde - die naam van die metode wat geroep moet word wanneer die gebeurtenis plaasvind.

Kom ons probeer dit in die praktyk. Gestel ons het die volgende metode:

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

Gestel ons het die volgende knoppie:

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

Kom ons maak dit so dat 'n klik op hierdie knoppie die metode show roep:

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

Gewoonlik gebruik almal die verkorte weergawe van v-on. Dit word voorgestel deur die simbool @ voor die naam van die gebeurtenis:

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

Maak 'n knoppie wat, wanneer daarop geklik word, die huidige datum deur alert vertoon.

Wysig die vorige taak sodat alert vertoon word nie by 'n klik nie, maar wanneer die muis daaroor beweeg.