article(s) dans votre panier VOIR

Boucler sur un composant réutilisable avec React Native

  • Vidéo 17 sur 33
  • 3h43 de formation
  • 33 leçons

Un contenu flash devrait s'afficher ici. Votre navigateur ne comporte pas de plugin flash, ou il ne s'est pas correctement initialisé.

Vous pouvez télécharger le plugin flash depuis le site d'Adobe à l'adresse suivante : http://get.adobe.com/flashplayer/.

Pour accéder à la suite de cette formation, vous devez vous abonner.
previous
summary
resume
next
play
Boucler sur un composant réutilisable
00:00 / 05:45
HD
fullscreen
Je m’abonne
à partir de 16,6 € / mois
  • Visionnage en ligne
  • Accès illimité à toutes nos formations
OU
J'achète uniquement
la formation
39,90€
  • Téléchargement + VOD à vie
  • Accès uniquement à cette formation

Détails de la formation

Avec ce tutoriel pour apprendre React Native, l’expert vous apprend comment boucler sur un composant. L’objectif de cette formation en ligne consiste à éviter la répétition des codes et d'afficher une liste de tweets de tailles différentes. Dans ce cadre, il est important que vous utilisiez la propriété map pour pouvoir renvoyer un tableau de JSX interprété par React Native. Pour ce faire, vous commencez par créer une fonction map. Vous ouvrez ensuite des accolades par lesquelles vous bouclez les propriétés d’objet à savoir l’id, la date, l’avatar, le tweet ainsi que l’username. En effet, la fonction map renvoie à un tableau dans lequel vous insérez directement un des objets tweet qui existe. Dans ce sens, il n’est plus nécessaire d’avoir plusieurs objets ayant le même code dans un fichier. En actualisant les données, il est possible que vous ayez des tweets identiques. Vous le constatez lorsque vous ne disposez pas de mot-clé unique sur chaque propriété enfant de la fonction map. Par rapport à cela, lorsque vous définissez un mot-clé, il est important d’afficher uniquement les propriétés que la boucle map renvoie. De cette manière, vous constatez que les codes sont beaucoup plus courts et que leur résultat est bien ordonné. Par ailleurs, vous avez la possibilité de déstructurer les props dans le cas où ils sont identiques aux propriétés du composant. Afin d’y parvenir, à l’intérieur du tweet, vous changez les propriétés d’objet par props. En complément de cela, vous imposez un id unique à savoir index qui sera le mot-clé principal. Par contre, les propriétés restantes peuvent être retirées en les changeant par la fonction props. En actualisant les données, vous avez le même résultat que la technique de la boucle précédente. Pour conclure, vous disposez de plusieurs méthodes pour afficher le moindre code possible tout en ayant les mêmes résultats.