Vue-dä reaksiýa şerti
Şertiň reaksiýaly bolmagyny edeliň. Mysal üçin, element-yuwas düwmesine basylanda ýaşyrylsyn. Bizde aşakdaky abzas bar bolsun:
App.vue<template>
<p v-if="visible">text</p>
</template>
Abzasy-myzyň başda görkezilýändigini edeliň:
javascriptdata() {
return {
visible: true,
}
}
Indi, basylýanda abzasyň ýaşyrylýan düwmesini edeliň:
App.vue<template>
<button @click="hide">hide</button>
<p v-if="visible">text</p>
</template>
Baglanyşykly usul visible aýratynlygyny
false üýtgeder, şeýlelik bilen abzasy-myzy
ýaşyrmaga mejbur eder:
javascriptmethods: {
hide: function() {
this.visible = false;
}
}
Задание 1
Abzas we düwme berlen. Abzas başda ýaşyrylan bolsun. Abzasy görkezýän düwme ýasalyň.
Задание 2
Abzas we iki düwme berlen. Birinji düwme abzasy görkezsin, ikinjisi bolsa ony ýaşyrsyn.
Задание 3
Öňki meseläni üýtgediň, şeýlelik bilen ekranda hemişe diňe bir düwme görünsin: eger abzas görkezilýän bolsa, ýaşyrmak üçin düwme, ýöne ýaşyrylan bolsa, görkezmek üçin düwme görünsin.