Իրադարձությունների մշակիչներ կցել 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>