CATALOGUE Code & Data Formation JavaScript Apprendre Vue JS 3 Apprendre les directives v-bind et v-model sur Vue.js

Apprendre les directives v-bind et v-model sur Vue.js

Utilisation conjointe des directives v-model et v-bind
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre Vue JS 3
Revoir le teaser Je m'abonne
Transcription
Cette leçon fait partie de la formation
69,00€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm
DescriptionProgrammeAvis
Cette leçon fait partie de la formation
69,00€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Mise en pratique des directives et gestion événementielle

Objectifs

Les objectifs de cette vidéo sont de comprendre l'utilisation des directives v-bind et v-model ensemble, d'apprendre à gérer des événements utilisateur et d'implémenter des interactions utilisateur complexes.

Résumé

Cette leçon couvre l'utilisation conjointe des directives v-bind et v-model de Vue.js, avec un exemple d'application pratique.

Description

Dans cette leçon, nous explorons comment utiliser les directives v-bind et v-model ensemble dans une application Vue.js. Tout d'abord, nous illustrons le comportement de ces directives avec deux champs de texte, où la saisie dans le premier champ est automatiquement recopiée et mise en majuscule dans le second champ. Ensuite, nous passons à des exercices plus complexes impliquant des cases à cocher (checkbox) et des boutons radio. Pour les checkbox, nous montrons comment leur état peut être suivi dans un tableau grâce à la directive v-model commune. Pour les boutons radio, nous expliquons comment sélectionner et afficher un choix unique parmi plusieurs options. Cette leçon inclut également une introduction à la gestion événementielle en utilisant v-on pour réagir aux frappes de touches sur le clavier.

Voir plus

Questions fréquentes

Que fait la directive v-model dans Vue.js ?
La directive v-model dans Vue.js lie la valeur d'un champ de formulaire directement à une variable de l'instance Vue, permettant une mise à jour bidirectionnelle.
Comment la directive v-bind est-elle utilisée dans Vue.js ?
La directive v-bind est utilisée pour lier dynamiquement une expression JavaScript à un attribut de balise HTML, ce qui permet de gérer des propriétés comme src, href, class, et d'autres.
À quoi sert la gestion des événements en Vue.js ?
La gestion des événements en Vue.js, via la directive v-on, permet de réagir aux actions de l'utilisateur telles que les clics, les frappes de touches, et autres interactions, en déclenchant des méthodes définies dans l'instance Vue.

Programme détaillé