Komplexa villkor i Vue
I direktivet v-if kan man göra
mer komplexa villkor. Låt oss till exempel anta
att egenskapen num kan
innehålla ett av talen 1, 2 eller
3:
data() {
return {
num: 3, // låt oss anta att det är 3 nu
}
}
Låt oss nu skapa tre stycken, varav
endast ett kommer att visas
beroende på värdet av
egenskapen num:
<template>
<p v-if="num === 1">ett</p>
<p v-if="num === 2">två</p>
<p v-if="num === 3">tre</p>
</template>
Man kan också göra mer komplexa villkor:
<template>
<p v-if="num === 1 || num === 3">
ett eller tre
</p>
</template>
Givet egenskapen day, som innehåller
nuvarande veckodag. Låt oss också anta att du har
sju stycken, i varje av dessa står det
namnet på en veckodag. Gör så att på skärmen
endast stycket som innehåller namnet på
nuvarande veckodag är synligt.
