Złożone warunki w Vue
W dyrektywie v-if można tworzyć
bardziej złożone warunki. Niech, na przykład,
we właściwości num może
znajdować się jedna z liczb 1, 2 lub
3:
data() {
return {
num: 3, // niech teraz jest tam 3
}
}
Teraz zróbmy trzy akapity, z
których będzie wyświetlany tylko jeden
w zależności od wartości
właściwości num:
<template>
<p v-if="num === 1">one</p>
<p v-if="num === 2">two</p>
<p v-if="num === 3">three</p>
</template>
Można tworzyć także bardziej złożone warunki:
<template>
<p v-if="num === 1 || num === 3">
one or two
</p>
</template>
Dana jest właściwość day, w której zapisany jest
bieżący dzień tygodnia. Niech również masz
siedem akapitów, w każdym z których napisana jest
nazwa dnia tygodnia. Spraw, aby na ekranie
widoczny był tylko akapit zawierający nazwę
bieżącego dnia tygodnia.
