Vue-da Murakkab Shartlar

v-if direktivida ancha murakkab shartlarni yaratish mumkin. Faraz qilaylik, masalan, num xususiyatida 1, 2 yoki 3 raqamlaridan biri bo'lsin:

javascriptdata() {
  return {
    num: 3, // hozir u yerda 3 deb faraz qilaylik
  }
}

Endi num xususiyatining qiymatiga qarab faqat bittasi ko'rsatiladigan uchta paragraf yaratamiz:

html<template>
  <p v-if="num === 1">one</p>
  <p v-if="num === 2">two</p>
  <p v-if="num === 3">three</p>
</template>

Bundan ham murakkab shartlarni yaratish mumkin:

html<template>
  <p v-if="num === 1 || num === 3">
    one or two
  </p>
</template>