Junior
Nommez les différences entre les directives v-show et v-if.
sobes.tech IA
Réponse de l'IA
v-if affiche conditionnellement un élément, en le supprimant complètement du DOM si la condition est fausse. v-show affiche toujours l'élément, mais alterne sa propriété CSS display entre none et sa valeur d'origine en fonction de la condition.
Différences en termes de performance / utilisation:
- v-if : Rendu initial plus lourd, mais meilleure performance en cas de changements peu fréquents, car les éléments sont complètement retirés du DOM.
- v-show : Rendu initial plus léger, mais préférable pour les éléments qui changent fréquemment, car il ne fait que changer la propriété CSS.
Exemple d'utilisation:
<!-- Utilisation de v-if -->
<template>
<div v-if="isVisible">
Ce bloc est visible uniquement si isVisible est vrai
</div>
<!-- Utilisation de v-show -->
<div v-show="isVisible">
Ce bloc est toujours dans le DOM, mais visible uniquement si isVisible est vrai
</div>
</template>
<script>
export default {
data() {
return {
isVisible: true
};
}
}
</script>