Masharti ya Kuitikia (Reactive Condition) katika Vue
Wacha tufanye hivi, ili sharti liwe la kuitikia. Kwa mfano tufanye hivi, ili kipengele kifichike kwa kubofya kitufe. Hebu tuwe na aya ifuatayo:
<template>
<p v-if="visible">maandishi</p>
</template>
Wacha tufanye hivi, ili aya yetu ionekane hapo mwanzo:
data() {
return {
visible: true,
}
}
Wacha sasa tufanye kitufe, kinachobofywa ambacho aya itafichika:
<template>
<button @click="hide">ficha</button>
<p v-if="visible">maandishi</p>
</template>
Njia iliyounganishwa itabadilisha
sifa visible kuwa false,
na hivyo kusababisha
aya yetu ifichike:
methods: {
hide: function() {
this.visible = false;
}
}
Imepewa aya na kitufe. Hebu aya ifichike hapo mwanzo. Fanya kitufe, ambacho kitaonyesha aya.
Imepewa aya na vitufe viwili. Hebu kitufe cha kwanza kionyeshe aya, na cha pili - kifichie.
Rekebisha shida iliyopita kwa namna ambayo daima kitufe kimoja tu kionekane kwenye skrini: ikiwa aya imeonyeshwa, basi kitufe cha kuficha, na ikiwa imefichwa - basi kitufe cha kuonyesha.