Condiții complexe în Vue

În directiva v-if se pot face condiții mai complexe. Să presupunem, de exemplu, că în proprietatea num poate fi unul dintre numerele 1, 2 sau 3:

javascriptdata() {
  return {
    num: 3, // să presupunem că acum este 3
  }
}

Acum să facem trei paragrafe, dintre care să fie afișat doar unul în funcție de valoarea proprietății 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>

Se pot face și condiții mai complexe:

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