Komplekse betingelser i Vue

I direktivet v-if kan man lage mer komplekse betingelser. La oss for eksempel si at i egenskapen num kan det være ett av tallene 1, 2 eller 3:

javascriptdata() {
  return {
    num: 3, // la oss si at det er 3 der nå
  }
}

La oss nå lage tre avsnitt, hvorav bare ett vil bli vist avhengig av verdien til egenskapen num:

html<template>
  <p v-if="num === 1">en</p>
  <p v-if="num === 2">to</p>
  <p v-if="num === 3">tre</p>
</template>

Man kan også lage mer komplekse betingelser:

html<template>
  <p v-if="num === 1 || num === 3">
    en eller to
  </p>
</template>