Tingimuslik kuvamine Vues

Järgmine direkter, mida me õpime, on v-if. Selle abil saab elemente kuvada või peita. Kuidas see direkter töötab: see võtab parameetrina mis tahes data objekti omaduse. Kui sellel omadusel on väärtus true - siis element kuvatakse, aga kui false - siis peidetakse.

Vaatame näidet. Olgu meil lõik atribuudiga v-if. Selle atribuudi väärtuseks olgu omadus visible, nii:

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

Määrame oma omaduse väärtuseks true. Sellisel juhul lõik kuvatakse:

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

Aga kui visible panna väärtuseks false, siis lõik peidetakse:

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