Comment pouvons-nous produire un tableau de données sous forme d'éléments J en tant que X?
Eh bien, en fait, c'est relativement trivial.
Nous allons mapper ce tableau de travaux, objets à un tableau de J. S. Éléments X car REACT est capable de
générer un tableau d'éléments JavaScript.
Pour cela, permettez-moi de vous montrer comment cela fonctionne.
Utilisons ces accolades simples, car je veux ajouter une expression JavaScript ici.
Dans mon expression, voici un tableau simple, mais un tableau d'éléments de liste.
Salut.
Et puis un autre.
Cela fonctionne, je produis ceci dans mon code J is X avec les accolades simples car cette année bien sûr n'est pas J est X,
c'est un tableau, mais c'est un tableau plein de J est X.
Et si je sécurise, ça sort haut et ça marche.
Nous obtenons une erreur ou un avertissement que vous pouvez ignorer pour l'instant.
Mais cela fonctionne en général.
Maintenant, puisque cela fonctionne avec des données codées en dur, nous pouvons également générer notre tableau d'objectifs afin de pouvoir produire des
objectifs d'accessoires ici.
Mais le problème est que les objectifs des accessoires sont finalement un tableau d'objets JavaScript, pas un tableau de J.
Code ASIC.
Donc, si nous essayons de produire cette année.
Cela échouera.
Il vous indique que les objets ne sont pas valides comme enfant réactif.
Alors que nous avons des enfants.
Donc, à la fin, nous ne pouvons pas produire d'objets JavaScript simples en vanille dans J est X.
Au lieu de cela, nous devons mapper chaque objet dans un J en tant qu'équivalent X.
Donc dans un élément renouvelable.
Donc, ici, nous voulons mapper chaque objet dans un élément de liste à la fin.
Donc, sur les objectifs des accessoires, qui est un tableau.
Nous pouvons appeler la méthode map.
C'est une méthode JavaScript vanille par défaut qui existe sur n'importe quel tableau.
La méthode map prend une fonction.
Ici, je vais passer une fonction de flèche qui est exécutée sur chaque élément du tableau.
Vous appelez la carte et le dysfonctionnement reviendra ici.
Transformez les mots de cet élément dans le tableau d'origine et la carte globale renverra alors un nouveau
tableau plein de ces données transformées.
Cette fonction recevra donc ici l'élément existant.
Ainsi, chaque objectif de notre tableau d'objectifs renvoie un nouvel élément.
Donc, dans ce nouveau tableau, retour par carte, je veux avoir un tas de J a X éléments.
Ici, je vais simplement retourner un élément de liste.
Elle est ex, bien sûr.
Et l'élément de liste, je veux sortir mon texte d'or, aucun objectif ici n'est que l'objet JavaScript que nous avons dans votre
tableau d'origine, car cette fonction s'exécute sur chaque élément du tableau d'origine et vous donne l'objet
dans le taux d'origine ou les données pièce dans le tableau d'origine comme argument.
Donc, le but ici est cet objet, qui ressemble à cette année.
Je ne suis donc intéressé que par le texte ici.
Et encore une fois, nous pouvons sortir le texte en sortant une expression JavaScript ici.
Par conséquent, nous avons besoin d'accolades dans notre code J is X ici et nous avons ici un texte de point d'objectif.
Mon expression est que j'accède à la propriété de texte sur l'objet or.
Alors maintenant, ce qui se passe ici est que je mappe mon tableau d'objets JavaScript simples à un tableau d'éléments J is X, et un
tel tableau de G. S. Les éléments X sont le rendu de facture, comme vous l'avez appris.
Maintenant, faites face à la sécurité.
Vous voyez, cela déjoue à nouveau mes compétences de base.
Maintenant, nous recevons également un avertissement concernant une clé unique qui est liée à la façon dont React rend le DOM
et qu'il souhaite le faire efficacement.
Vous en apprendrez plus à ce sujet dans mon React, le cours de guide complet.
Et donc, chaque fois que vous générez des listes de données avec cette technique, vous devez ajouter un accessoire spécial
à chaque élément que vous affichez dans la liste.
Dans ce cas, à chaque élément de la liste.
Et c'est l'accessoire clé qui est un accessoire qu'il comprend lui-même.
Et ici, je veux sortir l'objectif I. RÉ. encore.
Enveloppé dans des accolades frisées.
Parce que c'est une expression JavaScript régulière.
Alors maintenant avec papa, nous ne recevons pas l'avertissement et nous obtenons nos objectifs de cours.
Voilà donc comment nous sortons une liste de données.
Avec cela, cela semble assez bon.
Nous sortons notre liste de données.
Pourquoi ne travaillons-nous pas maintenant à ajouter des fonctionnalités qui nous permettent d'ajouter nos propres objectifs?
Ce serait une belle prochaine étape.