Vue-də hadisə işləyicilərinin əlavə edilməsi

Gəlin indi metodumuzu hansısa hadisə əsasında işə salaq. Hər hansı bir DOM elementinə hadisə əlavə etmək üçün v-on direktivindən istifadə etmək lazımdır.

Bu direktivdə nöqtəli vergüldən sonra hadisənin adı göstərilməli, qiymət kimi isə bu hadisə baş verəndə çağırılacaq metodun adı yazılmalıdır.

Gəlin praktikada sınayaq. Tutaq ki, bizim aşağıdakı metodumuz var:

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

Tutaq ki, bizim aşağıdakı düyməmiz var:

App.vue<template>
  <button>mətn</button>
</template>

Gəlin elə edək ki, bu düyməyə klikləyəndə show metodu çağırılsın:

App.vue<template>
  <button v-on:click="show">mətn</button>
</template>

Adətən hamı v-on-un qısaldılmış variantından istifadə edir. O, hadisənin adından əvvəl gələn @ simvolu ilə təmsil olunur:

App.vue<template>
  <button @click="show">mətn</button>
</template>