Складаныя ўмовы ў Vue

У дырэктыве v-if можна рабіць больш складаныя ўмовы. Хай, напрыклад, у ўласцівасці num можа быць адзін з лікаў 1, 2 або 3:

javascriptdata() {
  return {
    num: 3, // хай зараз там 3
  }
}

Давайце цяпер зробім тры абзацы, з якіх будзе паказаны толькі адзін у залежнасці ад значэння ўласцівасці num:

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

Можна рабіць і больш складаныя ўмовы:

html<template>
  <p v-if="num === 1 || num === 3">
    one or two
  </p>
</template>
Задание 1

Дадзена ўласцівасць day, у якой запісаны бягучы дзень тыдня. Хай таксама ў вас ёсць сем абзацаў, у кожным з якіх напісана назва дня тыдня. Зрабіце так, каб на экране быў бачны толькі абзац, які змяшчае назву бягучага дня тыдня.