Vue-də v-show direktivi

Şərti göstərmənin bir başqa variantı v-show direktividir. Çox oxşar şəkildə istifadə olunur:

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

Fərq ondadır ki, v-show olan element həmişə render olunacaq və DOM-da qalacaq, dəyişəcək olan isə yalnız onun CSS display xassəsidir.

v-if direktivi "həqiqi" şərti render etmə həyata keçirir, çünki o, şərt dəyişdikdə blokun daxilindəki hadisə dinləyicilərinin və uşaq komponentlərinin düzgün şəkildə məhv edilməsini və yenidən yaradılmasını təmin edir.

v-if direktivi həm də tənbəl (lazy) davranır: əgər şərt ilkin render zamanı yalanışdırsa, o, heç nə etməz - şərti blok şərt doğru olana qədər render olunmayacaq.

Müqayisə etdikdə, v-show daha sadədir - element həmişə, ilkin vəziyyətindən asılı olmayaraq, render olunur və CSS əsasında dəyişir.

Ümumiyyətlə, v-if-in dəyişmə dəyəri (toggle cost) daha yüksəkdir, v-show-in isə ilkin render dəyəri daha çoxdur. Beləliklə, əgər dəyişmələr tez-tez baş verəcəksə, v-show istifadə edin, və əgər şərt icra zamanı dəyişməyə bilərsə, v-if-ə üstünlük verin.