Sobes.tech
Junior

v-show və v-if direktivləri arasındakı fərqləri qeyd edin.

sobes.tech Süni İntellekt

AI-dan cavab

v-if şərt əsasında elementi şərtləndirir və şərt yalnış olduqda onu DOM-dan tamamilə silir. v-show isə həmişə elementi render edir, lakin onun CSS xüsusiyyəti display-i şərtə əsasən none və ilkin dəyər arasında dəyişir.

Performans / istifadə fərqləri:

  • v-if: Əvvəlki render daha ağırdır, lakin nadir dəyişikliklər üçün daha yaxşı performans göstərir, çünki elementlər tamamilə DOM-dan silinir.
  • v-show: Daha yüngül ilkin render, lakin tez-tez dəyişən elementlər üçün daha uyğundur, çünki yalnız CSS xüsusiyyəti dəyişir.

İstifadə nümunəsi:

<!-- v-if istifadə nümunəsi -->
<template>
  <div v-if="isVisible">
    Bu blok yalnız isVisible doğru olduqda görünür
  </div>

  <!-- v-show istifadə nümunəsi -->
  <div v-show="isVisible">
    Bu blok həmişə DOM-da olur, lakin yalnız isVisible doğru olduqda görünür
  </div>
</template>

<script>
export default {
  data() {
    return {
      isVisible: true
    };
  }
}
</script>