Éviter les accolades doubles dans les interpolations
Objectifs
Comprendre et appliquer la directive v-cloak pour améliorer l'affichage des interpolations dans Vue.js
Résumé
Apprenez à utiliser la directive v-cloak pour éviter l'apparition des accolades doubles dans les interpolations de Vue.js.
Description
Dans cette leçon, nous allons voir comment utiliser la directive v-cloak dans Vue.js pour empêcher les accolades doubles des interpolations de s'afficher dans le DOM avant que les expressions ne soient résolues par Vue.js. Nous commencerons par définir une propriété dans le modèle et l'afficherons dans un élément <div> en utilisant l'interpolation. Ensuite, nous introduirons l'utilisation de la directive v-cloak sur la balise <div> afin d'améliorer l'affichage. Nous ajouterons également des styles CSS pour masquer temporairement ces éléments jusqu'à ce que Vue.js prenne le relais pour évaluer et afficher les expressions.
Cette technique est essentielle pour améliorer l'expérience utilisateur en empêchant l'affichage temporaire de balises non résolues. Enfin, nous conclurons par une introduction à la directive v-once, qui sera abordée dans la vidéo suivante.