{{ name }}
\n\n\nCorriger le binding pour que la saisie utilisateur mette à jour la variable réactive en temps réel.","learningResourceType":"Practice problem","educationalLevel":"easy","teaches":["vue","vmodel","formulaire","reactivite"],"programmingLanguage":"Vue.js","provider":{"@type":"Organization","name":"CodeDuel","url":"https://codeduel.net"},"step":[{"@type":"HowToStep","text":"تحليل المطلوب والعناصر الموجودة."},{"@type":"HowToStep","text":"تنفيذ الحل."},{"@type":"HowToStep","text":"التحقق عبر الاختبارات والذكاء الاصطناعي."}],"url":"https://codeduel.net/ar/challenges/m54G8E4J3RZBvOrNqO2a","inLanguage":"ar"}Correction d'un champ contrôlé non synchronisé
السيناريو
Contexte : Une équipe RH utilise un formulaire Vue.js pour collecter des noms de candidats. Le Problème : La valeur saisie dans le champ input ne se reflète pas correctement dans l'affichage en dessous. Contraintes : Utiliser v-model. Pas de librairie externe. Code actuel : <script setup> import { ref } from 'vue'; const name = ref(""); </script> <template> <input :value="name" /> <p>{{ name }}</p> </template> Livrable attendu : Corriger le binding pour que la saisie utilisateur mette à jour la variable réactive en temps réel.
المهارات المستهدفة
حالات تطبيقية أخرى في Vue.js
- Correction d'un formulaire complexe avec objet réactif mal fusionnéمتقدم
- Conception d'un store global personnalisé sans Piniaخبير
- Correction d'un problème asynchrone dans onMountedمتقدم
- Conception d'un système de synchronisation multi-ongletsخبير
- Correction d'un problème de props non réactivesمتقدم
- Correction d'un système de cache local incohérentخبير
أسئلة أصلية من تصميم CodeDuel. لا ترتبط CodeDuel بأي ناشر أو هيئة اعتماد مذكورة؛ أسماء الشهادات والعلامات التجارية مملوكة لأصحابها، ولا تُذكر إلا للإشارة إلى المجال الذي يغطيه الاختبار. الإبلاغ عن محتوى
