javascript / beginner
Snippet
Bedingtes Rendering mit v-if
Die v-if-Direktive rendert ein Element bedingt, basierend auf dem Wahrheitswert eines Ausdrucks. Wenn dieser falsch ist, wird das Element vollständig aus dem DOM entfernt. v-else bietet einen Ersatz, wenn die Bedingung nicht erfüllt ist.
snippet.js
javascript
1
2
3
4
5
6
7
8
<template><button @click="isVisible = !isVisible">Toggle Message</button><p v-if="isVisible">Now you see me!</p><p v-else>The message is hidden.</p></template>
vue
Erklärung
1
v-if="isVisible"
Prüft die boolesche Variable, um zu entscheiden, ob der Absatz existieren soll.
2
v-else
Zeigt diesen Inhalt nur an, wenn die vorangehende v-if-Bedingung falsch ist.
3
@click="isVisible = !isVisible"
Ein einfacher Click-Handler, um den Sichtbarkeitsstatus umzuschalten.