• 15 heures
  • Moyenne

Ce cours est visible gratuitement en ligne.

course.header.alt.is_certifying

J'ai tout compris !

Mis à jour le 08/03/2022

Créez des composants réutilisables avec Vue.js

Compétences évaluées

  • Créer des composants réutilisables dans Vue.js
  • Question 1

    Si vous souhaitez passer des données à un composant enfant, quelle technique devez-vous utiliser ?

    • Propriétés calculées

    • Methods

    • Props

    • Data store

  • Question 2

    Il y a actuellement un bug dans notre application. Comme vous le voyez ci-dessous, un composant affiche différents types de données dans le message, tels que des arrays et des objets.

    <template>
        <p>{{ message }}</p>
     </template>
     
     <script>
     export default {
        props: ['message']
     }
     </script>
    

    Quel est le meilleur moyen d'éviter ce genre de problème ?

    • Définir la propriété  required  dans la prop.

    • Définir le type de propriété avec une valeur  String.

    • Définir une propriété  default  dans la prop.

    • Définir un nom de prop personnalisé qui indique aux autres développeurs de n'utiliser que des chaînes de caractères.

  • Question 3

    Un développeur essaie d'utiliser les techniques SCSS dans le bloc de code ci-dessous.

    <template>
        <div class="form-wrapper">
            <label class="form-label">Nom du formulaire</label>
            <input class="form-input" type="text" />
        </div>
     </template>
     
     <style>
     .form {
        &-wrapper { margin: 25px 0; }
        &-label { font-size: 1.2rem; }
        &-input { padding: 10px 5px; }
     }
     </style>
    

    Qu’a-t-il mal fait ?

    • Il doit ajouter l'attribut  scss  au bloc  <style>.  

    • Il doit ajouter l'attribut  lang="scss"  au bloc  <style>.

    • Il doit envelopper les styles dans un bloc  <scss>.

    • Il doit ajouter l'attribut  preprocessor="scss"  au bloc  <style>.

Et si vous obteniez un diplôme OpenClassrooms ?
  • Formations jusqu’à 100 % financées
  • Date de début flexible
  • Projets professionnalisants
  • Mentorat individuel
Trouvez la formation et le financement faits pour vous