Vueda reaktiv sərt
Gəlin sərti reaktiv edək. Məsələn, elementi düyməni kliklədikdə gizlədək. Tutaq ki, bizdə aşağıdakı abzas var:
<template>
<p v-if="visible">mətn</p>
</template>
Gəlin abzasımızın əvvəldən görünən olmasını təmin edək:
data() {
return {
visible: true,
}
}
İndi isə kliklədikdə abzası gizlədəcək bir düymə edək:
<template>
<button @click="hide">gizlət</button>
<p v-if="visible">mətn</p>
</template>
Bağlanmış metod visible
xassəsini false olaraq dəyişəcək,
bununla da abzasımızın
gizlənməsinə səbəb olacaq:
methods: {
hide: function() {
this.visible = false;
}
}
Bir abzas və bir düymə verilmişdir. Abzas əvvəldən gizli olsun. Abzası göstərəcək bir düymə edin.
Bir abzas və iki düymə verilmişdir. Birinci düymə abzası göstərsin, ikincisi isə onu gizlətsin.
Əvvəlki məsələni elə dəyişin ki, ekranda həmişə yalnız bir düymə görünsün: əgər abzas göstərilibsə, onda gizlətmə düyməsi, əgər gizlidirsə - onda göstərmə düyməsi.
