Elemente in Vue ein- und ausblenden
Lassen Sie uns nun einen Button erstellen, der
einen Absatz ein- und ausblendet, also beim ersten
Klick ihn anzeigt und beim zweiten
Klick - versteckt. Dafür rufen wir beim Klick
auf den Button die Methode
toggle auf:
<template>
<button @click="toggle">toggle</button>
<p v-if="visible">text</p>
</template>
Im Code der Methode muss der
Wert der Eigenschaft visible
genommen und in seinen
Gegenteil umgekehrt werden:
toggle: function() {
this.visible = !this.visible;
}
Gegeben sind drei Absätze und drei Buttons. Sorgen Sie dafür, dass jeder Button seinen eigenen Absatz ein- und ausblendet.
