Навяшванне апрацоўшчыкаў падзей у 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>