Ռեակտիվ պայման Vue-ում

Եկեք անենք, որ պայմանը դառնա ռեակտիվ: Օրինակ՝ անենք, որ տարրը թաքնվի կոճակի սեղմումից: Ենթադրենք ունենք հետևյալ պարբերությունը.

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

Եկեք անենք, որ մեր պարբերությունը սկզբում ցուցադրված լինի.

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

Հիմա ստեղծենք կոճակ, որի սեղմումով պարբերությունը կթաքնվի.

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

Կապված մեթոդը կփոխի visible հատկությունը false-ի, դրանով իսկ ստիպելով մեր պարբերությունը թաքնվել.

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