Rodymas pagal sąlygą Vue

Kita direktyva, kurią išnagrinėsime, vadinama v-if. Su jos pagalba galima rodyti arba slėpti elementus. Kaip ši direktyva veikia: parametru ji priima bet kurią objekto data savybę. Jei ši savybė turi reikšmę true - tuomet elementas bus rodomas, o jei false - tuomet paslėptas.

Pažiūrėkime pavyzdžiu. Tegu mes turime pastraipą su atributu v-if. Šio atributo reikšme tegu būna savybė visible, štai taip:

App.vue<template>
  <p v-if="visible">text</p>
</template>

Nustatykime mūsų savybės reikšmę į true. Šiuo atveju pastraipa bus rodoma:

javascriptdata() {
  return {
    visible: true,
  }
}

O štai jei visible nustatysime į reikšmę false, tai pastraipa bus paslėpta:

javascriptdata() {
  return {
    visible: false,
  }
}