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:
<template>
<p v-if="visible">text</p>
</template>
Määrame oma omaduse väärtuseks
true. Sellisel juhul
lõik kuvatakse:
data() {
return {
visible: true,
}
}
Aga kui visible panna väärtuseks
false, siis lõik peidetakse:
data() {
return {
visible: false,
}
}
Olgu data-s salvestatud omadus visible.
Olgu teil ka kaks lõiku. Tehke nii,
et esimene lõik kuvataks ekraanil,
kui omadus visible võrdub true,
aga teine lõik, vastupidi, kuvataks, kui omadus
visible võrdub false.
