Junior
Numește diferențele dintre directivele v-show și v-if.
sobes.tech AI
Răspuns de la AI
v-if condiționează redarea unui element, eliminându-l complet din DOM dacă condiția este falsă. v-show redă întotdeauna elementul, dar comută proprietatea sa CSS display între none și valoarea inițială în funcție de condiție.
Diferențe în performanță / utilizare:
- v-if: Randare inițială mai grea, dar performanță mai bună în caz de comutări rare, deoarece elementele sunt eliminate complet din DOM.
- v-show: Randare inițială mai ușoară, dar mai bun pentru elemente care se schimbă frecvent, deoarece schimbă doar proprietatea CSS.
Exemplu de utilizare:
<!-- Utilizarea v-if -->
<template>
<div v-if="isVisible">
Acest bloc este vizibil doar dacă isVisible este adevărat
</div>
<!-- Utilizarea v-show -->
<div v-show="isVisible">
Acest bloc este întotdeauna în DOM, dar vizibil doar dacă isVisible este adevărat
</div>
</template>
<script>
export default {
data() {
return {
isVisible: true
};
}
}
</script>