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:

App.vuemethods: {
  show: function() {
    alert('!');
  }
}

Gestel ons het die volgende knoppie:

App.vue<template>
  <button>text</button>
</template>

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

App.vue<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:

App.vue<template>
  <button @click="show">text</button>
</template>