Test technique VueJS | QCM & Quiz – Partie 15
Les QCM VueJS sont un excellent moyen de tester et d’approfondir vos connaissances sur ce puissant framework JavaScript. Que vous soyez débutant cherchant à maîtriser les bases ou développeur expérimenté souhaitant valider vos compétences techniques, nos quiz interactifs vous permettent d’évaluer votre compréhension de VueJS. Grâce à des questions ciblées sur des concepts clés comme les composants, la gestion d’état et les directives, ces tests vous aideront à progresser rapidement et à renforcer vos compétences en développement web.
1. Quelle méthode est utilisée pour déclencher une transition lorsqu’un élément entre ou quitte le DOM ?
A this.$transition()
B v-transition
C v-bind:transition
D transition
(avec des hooks before-enter
, enter
, leave
, etc.)
2. Qu’est-ce que le lazy-loading des composants dans Vue.js ?
A Charger tous les composants à la demande, uniquement lorsque cela est nécessaire pour réduire la taille du bundle.
B Charger un composant dès le démarrage de l’application pour améliorer les performances.
C Charger un composant uniquement lorsque l’utilisateur clique dessus.
D Charger les composants dans un ordre aléatoire pour optimiser le temps de chargement.
3. Comment faire pour partager de l’état entre plusieurs composants dans Vue.js sans utiliser Vuex ?
A En utilisant des événements personnalisés uniquement.
B En utilisant un service global ou un objet réactif via Vue.observable()
.
C En passant les données via des props entre chaque composant.
D En utilisant localStorage pour stocker l’état.
4. Que fait le code VueJS suivant ?
<div> <p>{{ message.length }}</p> </div>
export default { data() { return { message: 'Bonjour Vue.js' } } }
A Affiche la longueur de la chaîne message.
B Affiche le texte « Bonjour Vue.js ».
C Affiche une erreur car on ne peut pas utiliser .length dans Vue.js.
D Affiche « Bonjour » sans le reste du texte.
5. Quel hook de cycle de vie de Vue.js est appelé avant que l’instance Vue soit montée dans le DOM ?
A created()
B mounted()
C beforeMount()
D updated()
6. Comment peut-on passer des données dynamiques à un composant via des slots dans Vue.js ?
A En utilisant des props
pour lier des données au slot.
B En utilisant v-bind
sur le slot pour lier des données.
C En passant des données directement dans le slot
dans le template.
D En déclarant un modèle avec v-model
dans le slot.
7. Comment définir un composant global dans Vue.js ?
A Vue.component('my-component', {})
B Vue.use('my-component')
C Vue.createComponent('my-component', {})
D Vue.mount('my-component')
8. Quelle méthode de Vuex permet de déclencher des mutations pour changer l’état global de l’application ?
A commit()
B dispatch()
C mutate()
D update()
9. Comment créer un composant dynamique dans Vue.js avec v-bind
?
A Utiliser v-bind
pour lier une URL dynamique à un composant.
B Utiliser v-bind
pour lier un attribut ou une propriété d’un composant à une valeur dynamique.
C Utiliser v-bind
pour inclure un composant au sein d’un autre.
D Utiliser v-bind
pour rendre un composant visible ou non.
10. Quelle méthode est utilisée pour accéder à l’objet $router
dans un composant Vue.js ?
A this.router
B this.$route
C this.$router
D this.getRouter()