რთული პირობები Vue-ში
v-if დირექტივაში შესაძლებელია
უფრო რთული პირობების შექმნა. მაგალითად, დავუშვათ
num თვისებაში შეიძლება იყოს
ერთ-ერთი რიცხვი 1, 2 ან
3:
data() {
return {
num: 3, // დავუშვათ ახლა არის 3
}
}
ახლა კი შევქმნათ სამი აბზაცი, რომელთაგან
გამოჩნდება მხოლოდ ერთი
num თვისების მნიშვნელობის მიხედვით:
<template>
<p v-if="num === 1">ერთი</p>
<p v-if="num === 2">ორი</p>
<p v-if="num === 3">სამი</p>
</template>
ასევე შესაძლებელია უფრო რთული პირობების შექმნა:
<template>
<p v-if="num === 1 || num === 3">
ერთი ან სამი
</p>
</template>
მოცემულია თვისება day, რომელშიც ჩაწერილია
მიმდინარე კვირის დღე. დავუშვათ ასევე გაქვთ
შვიდი აბზაცი, თითოეულში რომელიც ჩაწერილია
კვირის დღის სახელწოდება. გახადეთ ისე, რომ ეკრანზე
გამოჩნდეს მხოლოდ ის აბზაცი, რომელიც შეიცავს
მიმდინარე კვირის დღის სახელს.