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:
App.vue<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:
javascriptdata() {
return {
visible: true,
}
}
İndi isə kliklədikdə abzası gizlədəcək bir düymə edək:
App.vue<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:
javascriptmethods: {
hide: function() {
this.visible = false;
}
}
Задание 1
Bir abzas və bir düymə verilmişdir. Abzas əvvəldən gizli olsun. Abzası göstərəcək bir düymə edin.
Задание 2
Bir abzas və iki düymə verilmişdir. Birinci düymə abzası göstərsin, ikincisi isə onu gizlətsin.
Задание 3
Ə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.