Директива v-show дар Vue

Як варианти дигари намоиши шартӣ директиваи v-show мебошад. Хеле монанд истифода мешавад:

html<template>
  <p v-show="isAuth">
    +++
  </p>
</template>

Фарқ он аст, ки унсури бо v-show ҳамеша тарҳрезии карда мешавад ва дар DOM боқӣ мемонад, ва танҳо хосияти CSS-и он display иваз карда мешавад.

Директиваи v-if "ҳақиқӣ" тарҳрезии шартиро иҷро мекунад, зеро кафолат медиҳад, ки гӯшкунандагони рӯйдодҳо ва компонентҳои фарзандӣ дар дохили блок мувофиқи зарурӣ нест карда ва аз нав эҷод карда мешаванд дар вақти иваз кардани шарт.

Директиваи v-if инчунин танбал аст: агар шарт дарҳоли тарҳрезии ибтидоӣ дурӯғ бошад, пас он чизе намекунад - блоки шартӣ то он даме ки шарт рост нашавад, тарҳрезӣ намешавад.

Барои муқоиса, v-show хеле соддатар аст - унсур ҳамеша тарҳрезии мешавад, новобаста аз �олати ибтидоӣ бо иваз кардан асоси CSS.

Ҳамагӣ, v-if хароҷоти баландтар барои иваз кардан дорад, дар ҳоле ки v-show хароҷоти бештар барои тарҳрезии ибтидоӣ дорад. Пас, v-show-ро истифода баред, агар иваз карданҳо зуд-зуд рух диҳанд, ва v-if-ро тарҷеҳ диҳед, агар шарт дар вақти иҷро шояд тағйир наёбад.

Директиваи v-show-ро наметавон рӯи унсури template истифода кард ва он бо v-else кор намекунад.

Задание 1

Абзас ва тугма дода шудааст. Чунин кунед, ки абзас бо фишурдани тугма toggle шавад.

Задание 2

Фарқиятҳои директиваҳои v-show ва v-if-ро шарҳ диҳед.

Задание 3

Шарҳ диҳед, ки вақте чӣ хубтар аст истифода бурдани директиваи v-show, ва вақте - v-if.

Задание 4

Чӣ маҳдудиятҳо директиваи v-show дорад, шарҳ диҳед.