Jak możemy wyprowadzić tablicę danych jako J jako elementy X?
Właściwie to jest stosunkowo trywialne.
Zmapujemy tę tablicę zadań, obiektów na tablicę J. S. X elementów, ponieważ REACT jest w stanie
wygenerować tablicę elementów JavaScript.
W tym celu pokażę ci, jak to działa.
Użyjmy tych pojedynczych nawiasów klamrowych, ponieważ chcę tutaj dodać wyrażenie JavaScript.
Moim zdaniem, tutaj jest prosta tablica, ale tablica elementów listy.
Cześć.
A potem jeszcze jeden.
To działa, wyprowadzam to w moim kodzie J to X z pojedynczymi nawiasami klamrowymi, ponieważ w tym roku oczywiście nie jest to J to
X, to jest tablica, ale jest to tablica pełna J to X.
A jeśli mam bezpieczeństwo, to daje wysoką moc i to działa.
Otrzymujemy błąd lub ostrzeżenie, które na razie możesz zignorować.
Ale to działa ogólnie.
Teraz, ponieważ działa to na danych zakodowanych na stałe, możemy również wypisywać nasz zestaw celów, abyśmy mogli tutaj wypisywać
cele rekwizytów.
Problem w tym, że cele rekwizytów to w końcu tablica obiektów JavaScript, a nie tablica J.
Kod ASIC.
Więc jeśli spróbujemy wydać w tym roku.
To zawiedzie.
Mówi ci, że obiekty nie są poprawne jako dziecko reagujące.
Podczas gdy my mamy dzieci.
Tak więc ostatecznie nie możemy wyprowadzać zwykłych waniliowych obiektów JavaScript w J to X.
Zamiast tego musimy zamapować każdy obiekt na J jako ekwiwalent X.
Tak więc w odnawialny element.
Więc tutaj chcemy na końcu zamapować każdy obiekt na element listy.
Tak więc na rekwizytach cele, które są tablicą.
Możemy wywołać metodę mapy.
Jest to domyślna waniliowa metoda JavaScript, która istnieje w dowolnej tablicy.
Metoda mapy ma funkcję.
Tutaj przekażę funkcję strzałki, która jest wykonywana na każdym elemencie tablicy.
Włączysz mapę, a wtedy dysfunkcja wróci.
Przekształć słowa tego elementu w oryginalnej tablicy, a ogólna mapa zwróci nową tablicę
pełną tych przekształconych elementów danych.
Dlatego funkcja ta otrzyma tutaj istniejący element.
Więc każdy cel w naszej tablicy celów, a następnie zwraca nowy element.
Więc w tej nowej tablicy, wróć mapą, chcę, żeby kilka J zawierało X elementów.
Więc tutaj zwrócę tylko element listy.
Która jest oczywiście eks.
I element listy, chcę wyprowadzić mój złoty tekst, nie ma tutaj celu, że obiekt JavaScript mamy w oryginalnej
tablicy, ponieważ ta funkcja działa na każdym elemencie w oryginalnej tablicy i daje obiekt
w oryginalnej szybkości lub danych kawałek w oryginalnej tablicy jako argument.
Więc celem jest ten obiekt, który wygląda jak w tym roku.
Więc interesuje mnie tylko tekst tutaj.
I znowu możemy wyprowadzić tekst, wysyłając tutaj wyrażenie JavaScript.
Dlatego potrzebujemy nawiasów klamrowych w naszym kodzie J jest X tutaj i mamy tutaj tekst kropki celu.
Wyrażam to, że mam dostęp do właściwości tekstu na złotym obiekcie.
Tak więc teraz dzieje się to, że mapuję moją tablicę prostych obiektów JavaScript na tablicę J to elementy X, a
taka tablica G. S. X elementów to rachunek renderowania, jak się dowiedziałeś.
Teraz chroń twarz.
Widzisz, to znowu przechytrza moje podstawowe umiejętności.
Teraz otrzymujemy również ostrzeżenie dotyczące unikalnego klucza związanego z tym, jak reaguje ponownie renderuje DOM i że
chce to zrobić skutecznie.
Więcej na ten temat dowiesz się w moim React, pełnym przewodniku.
Dlatego za każdym razem, gdy generujesz listy danych za pomocą tej techniki, musisz dodać specjalny rekwizyt
do każdego elementu, który wyświetlasz na liście.
W takim przypadku do każdego elementu listy.
I to jest kluczowy rekwizyt, który rekwizyt sam rozumie.
I tutaj chcę przedstawić cel I. RE. jeszcze raz.
Owinięte w nawiasy klamrowe.
Ponieważ jest to regularne wyrażenie JavaScript.
Więc teraz z tatą nie otrzymujemy ostrzeżenia i osiągamy nasze cele kursu.
W ten sposób wypisujemy listę danych.
Dzięki temu wygląda to całkiem nieźle.
Tworzymy naszą listę danych.
Dlaczego nie pracujemy teraz nad dodaniem funkcjonalności, która pozwala nam dodawać własne cele?
To byłby miły następny krok.