Реактивен услов во Vue
Ајде да направиме условот да биде реактивен. На пример, да направиме елементот да се сокрива при клик на копче. Нека имаме следниов пасус:
<template>
<p v-if="visible">text</p>
</template>
Да направиме нашиот пасус првично да биде прикажан:
data() {
return {
visible: true,
}
}
Сега да направиме копче, при клик на кое пасусот ќе се сокрива:
<template>
<button @click="hide">hide</button>
<p v-if="visible">text</p>
</template>
Поврзаниот метод ќе го промени
својството visible во false,
со што ќе предизвика нашиот
пасус да се сокрие:
methods: {
hide: function() {
this.visible = false;
}
}
Даден е пасус и копче. Нека пасусот првично е скриен. Направете копче, кое ќе го прикажува пасусот.
Даден е пасус и две копчиња. Нека првото копче го прикажува пасусот, а второто - го скрива.
Модифицирајте ја претходната задача така што на екранот секогаш ќе биде видливо само едно копче: ако пасусот е прикажан, тогаш копчето за скривање, а ако е скриен - тогаш копчето за прикажување.
