Test technique VueJS | QCM & Quiz – Partie 3

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 est la fonction des filters dans Vue.js ?

A Modifier les données avant de les afficher dans le DOM

B Créer des boucles de données dans le DOM

C Appliquer des styles dynamiques aux éléments HTML

D Appliquer des animations CSS aux éléments HTML

Réponse  

2. Comment créer un composant local dans Vue.js ?

A En appelant this.$registerComponent()

B En utilisant la fonction Vue.createComponent()

C En déclarant le composant directement dans la méthode created()

D En déclarant le composant dans l’option components de l’instance Vue

Réponse  

3. Quelle méthode Vue.js permet de changer directement le DOM ?

A set()

B $set()

C render()

D update()

Réponse  
 

4. Quel est l’utilitaire de Vue.js pour effectuer des transitions lors de l’entrée ou la sortie d’un élément du DOM ?

A v-move

B v-transition

C v-enter

D v-bind:transition

Réponse  

5. Quel est l’objectif de la composition API dans Vue.js 3 ?

A Simplifier la gestion des événements dans les composants.

B Offrir une alternative plus flexible à l’option API pour l’organisation du code.

C Créer des directives personnalisées dans Vue.js.

D Faciliter l’intégration avec des bibliothèques tierces.

Réponse  

6. Dans Vue.js, quelle est la principale différence entre les options data et props ?

A data est utilisé pour définir des données réactives, tandis que props est utilisé pour recevoir des données d’un composant parent.

B data est utilisé pour les propriétés d’un composant enfant, tandis que props est pour les données globales.

C data est réactif, mais props ne l’est pas.

D props est utilisé uniquement dans les composants de classe, tandis que data est utilisé dans les composants fonctionnels.

Réponse  
 

7. Quelle directive est utilisée pour écouter les événements dans Vue.js ?

A v-listen

B v-on

C v-event

D v-click

Réponse  

8. Que fait le code VueJS suivant ?

new Vue({
  el: '#app',
  data: {
    message: 'Bonjour Vue.js!'
  },
  methods: {
    changeMessage: function() {
      this.message = 'Message changé !';
    }
  }
});

A Ce code crée une instance Vue avec une propriété message qui est initialisée à ‘Bonjour Vue.js!’ et une méthode changeMessage qui modifie la valeur de message.

B Ce code crée une instance Vue avec une propriété message et une méthode changeMessage, mais la méthode n’a aucun effet.

C Ce code crée une instance Vue qui affiche uniquement « Message changé ! » dans le DOM.

D Ce code est invalide car Vue.js ne prend pas en charge l’option methods.

Réponse  

9. Que fait le code VueJS suivant ?

<div id="app">
  <input v-model="message">
  <p>{{ message }}</p>
</div>

new Vue({
  el: '#app',
  data: {
    message: 'Hello!'
  }
});

A Vue.js va générer une erreur car v-model ne peut pas être utilisé sur un <input>.

B L’input sera ignoré et ne fera rien.

C Le texte dans l’élément <p> restera toujours « Hello! » quelle que soit la modification dans l’input.

D Le texte dans l’élément <p> affichera la valeur du message et se mettra à jour en temps réel lorsque l’utilisateur modifie l’input.

Réponse  
 

10. Que fait la fonction nextTick() dans Vue.js ?

A Elle permet de modifier les données immédiatement après que l’affichage soit mis à jour.

B Elle permet de forcer une mise à jour du DOM immédiatement.

C Elle permet d’attendre que le DOM soit mis à jour avant d’exécuter un code.

D Elle permet de retarder l’exécution d’une fonction jusqu’à la prochaine itération du DOM.

Réponse