Kushti Reaktiv në Vue

Le ta bëjmë në mënyrë që kushti të jetë reaktiv. Për shembull, le ta bëjmë në mënyrë që elementi të fshihet duke klikuar në një buton. Le të themi se kemi paragrafin në vijim:

App.vue<template>
  <p v-if="visible">text</p>
</template>

Le ta bëjmë në mënyrë që paragrafi ynë të shfaqet fillimisht:

javascriptdata() {
  return {
    visible: true,
  }
}

Tani le të bëjmë një buton, duke klikuar në të cilin paragrafi do të fshihet:

App.vue<template>
  <button @click="hide">hide</button>
  <p v-if="visible">text</p>
</template>

Metoda e lidhur do të ndryshojë vetinë visible në false, duke e bërë kështu paragrafin tonë të fshihet:

javascriptmethods: {
  hide: function() {
    this.visible = false;
  }
}