Додавање на обработувачи на настани во Vue

Ајде сега да го стартуваме нашиот метод преку некој настан. За да додадете настан на некој DOM елемент, треба да ја користите директивата v-on.

Во оваа директива, после двоточката треба да се наведе името на настанот, а како вредност - името на методот, кој треба да се повика при случување на тој настан.

Ајде да пробаме во пракса. Да претпоставиме дека го имаме следниов метод:

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

Да претпоставиме дека ја имаме следната копче:

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

Ајде да направиме така што при клик на ова копче да се повика методот show:

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

Обично сите го користат скратениот вариант v-on. Тој се претставува како симбол @ пред името на настанот:

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