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:

javascriptdata() {
  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:

html<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:

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