Vue-də elementlərin göstərilməsi və gizlədilməsi

İndi gəlin bir düymə edək ki, abzası göstərsin və gizlətsin, yəni ilk klikdə onu göstərsin, ikinci klikdə isə gizlətsin. Bunun üçün düyməyə klik edəndə toggle metodu çağıracağıq:

App.vue<template>
  <button @click="toggle">toggle</button>
  <p v-if="visible">mətn</p>
</template>

Metodun kodunda visible xassəsinin qiymətini götürmək və onu əksinə çevirmək lazımdır:

javascripttoggle: function() {
  this.visible = !this.visible;
}