Wyprowadzać nasze własne cele.
Dodam nowy komponent do folderu komponentów i utrzymam go w zarządzaniu.
Stworzę nowy podfolder dla każdego komponentu.
Nie jest to konieczne, ale osobiście lubię to robić, ponieważ wtedy mogę szybko znaleźć wszystkie moje komponenty.
Oczywiście musisz teraz dostosować import tutaj.
Mój pomysł zrobił to automatycznie na wypadek, gdyby tak się nie stało.
Upewnij się, że dostosujesz import listy celów, aby odzwierciedlić to w U.
Teczka.
Dodałem.
A następnie doda nowy komponent celu tutaj również w folderze składników.
Dodaj nowy plik jazzowy do bramki i nowy cel.
Zobacz nas jak jesień.
Jeśli chcesz teraz zastosować stylizację w nowym złotym pliku jazzowym, najpierw musimy zaimportować reakcję z
reakcji.
Zawsze musisz to zrobić.
W przeciwnym razie nie można użyć J jako X w tym pliku, ponieważ należy pamiętać o J jako przetłumaczonym exis, aby zareagować na utworzenie
elementu.
A potem tutaj mam swój nowy element celu.
Możemy zaakceptować miejsce Proppa, o ile ich nie potrzebujemy.
Nie musimy.
A potem eksportuję nowy cel.
Teraz w Abcess chcę oddać nowy cel, więc zaimportujemy nowe złoto.
Ponownie, nazwa tutaj należy do ciebie, ale powinna zaczynać się od dużej postaci startowej.
I importuję to z komponentów.
Nowy cel.
I tutaj możemy renderować jak powyżej naszej listy celów, powiedzmy tak.
Nie, to nie zadziałałoby, ponieważ nowy cel nie jest jeszcze ważnym składnikiem reakcji, ponieważ jest to funkcja w tej chwili, ale
nie jest to funkcja, która działa jako składnik reakcji, ponieważ nie robi jednej kluczowej rzeczy.
Nie wraca do swojego X.
Wróćmy więc.
Jestem J, X tu i tam, aby uprościć sprawę, wszystko na forum.
I na tym forum dodam pole wejściowe.
Wpisz tekstowy element samozamykający w zwykłym języku HGL.
To nie musi być samozamykające się w J to X.
To musi być samozamykające.
A następnie przycisk, który jest typu przesłać.
Jak mówię w Gohl, bardzo prosta forma, a jeśli teraz możemy to bezpiecznie, powinieneś ją zobaczyć tutaj.
Dodajmy teraz stylizację, aby wyglądało to nieco ładniej dla daddle i klasa, aby utworzyć nowe złote kreski.
I zaimportuję nowe złoto jako plik do nowego złotego pliku JavaScript.
A tutaj nowa klasa złota, która została dodana do formularza w całości.
Margines dwóch REM we wszystkich kierunkach i wierszu tekstu.
Dzięki temu wygląda to trochę ładniej.
A teraz moglibyśmy również stylizować wejście przycisku.
Ale nie chcę poświęcać temu zbyt wiele czasu.
Ale zostawmy to tak, jak jest teraz.
Nawiasem mówiąc, po kliknięciu przycisku strona zostanie ponownie załadowana, ponieważ teraz uruchomi się
domyślna funkcja przeglądarki.
Oznacza to, że po kliknięciu przycisku „Prześlij typ wyłączony” na forum żądanie jest wysyłane do serwera
obsługiwanego na tej stronie.
Nie jest to jednak zachowanie, którego chcemy tutaj, ponieważ tutaj nie chcę wysyłać żądania do żadnego
serwera, ponieważ nie robimy nic po stronie serwera.
Zamiast tego chcę obsłużyć to kliknięcie za pomocą JavaScript i to jest pierwsza rzecz, którą tutaj zrobię.
Zobaczmy, jak radzimy sobie ze zdarzeniami, ponieważ do tej pory tego nie zrobiliśmy.
Chcę obsłużyć wydarzenie tego forum tutaj i zareagować, to takie proste.
Możemy dodać detektory zdarzeń do dowolnego elementu, nie tylko na forum, ale do dowolnego elementu, dodając małe
litery na.
A potem nazwa wydarzenia.
Nie, nie każde zdarzenie jest obsługiwane w każdym elemencie.
Ale tutaj masz domyślną HD, wszystkie elementy są dostępne.
Na przykład w elemencie forum, w którym musisz przesłać zdarzenie, prześlij przycisk.
Masz również na kliknięcie.
Ale ponieważ jest to przycisk na forum, lepiej jest obsługiwać go na samym forum.
Co teraz przekazujesz jako wartość Enns up Mido jako wartość?
Musisz przekazać funkcję, która powinna zostać uruchomiona, gdy to zdarzenie się wydarzy.
Wskaźnik do funkcji.
Możesz zrobić w tym roku z nawiasami klamrowymi, a następnie anonimową funkcją liniową.
Ale nie lubię tego za bardzo.
Zamiast tego utworzę tutaj nową funkcję.
A w JavaScript możesz tworzyć funkcje i funkcje.
Więc zamiast nowej funkcji celu, którą nadal jest, w końcu mogę utworzyć nową funkcję.
Stworzę moje.
Nazwy notatek dla osoby zajmującej się celami zależą od Ciebie.
Ale podobało mi się jego nazywanie Handlera na końcu mojego funkowego imienia.
Jeśli jest to funkcja uruchamiana po pewnym zdarzeniu.
Jest to więc funkcja w tym przypadku, jeszcze raz użyję funkcji strzałki, co nie
jest koniecznością, ale użyję tutaj tylko funkcji strzałki, a Enns up Mitt może teraz wskazywać na AD Gohl Handler.
Nie wykonuj go tutaj, więc nie dodawaj nawiasów.
Zamiast tego po prostu chcesz wskazać funkcję, aby przeglądarka i zareagować wspólnym wysiłkiem, mogła spowodować
dla ciebie dysfunkcję.
Kiedy nastąpi zdarzenie przesyłania?
Teraz ta funkcja otrzyma obiekt zdarzenia, parametr zdarzenia przekazywany automatycznie przez zareaguj, a następnie na przykład możemy wywołać
funkcję zapobiegania domyślnemu, co zapobiega domyślnemu wysyłaniu przez przeglądarkę żądania do jakiegoś zaplecza, czego nie powinien
tutaj robić, ponieważ tutaj nie obsługuję tego po stronie serwera.
Nasz serwer obsługuje tylko ten pojedynczy plik indeksu HMO.
Nie ma logiki do obsługi żadnych zgłoszeń.
Zamiast tego chcę obsłużyć go tutaj w JavaScript na interfejsie.
W mojej aplikacji REACT i na razie zignoruję to, co wpisał użytkownik, i po
prostu utworzę fałszywy cel.
I chcę przekazać ten fałszywy cel aplikacji G. S. i dodaj go tutaj do mojego podstawowego Scholesa, aby następnie został
tutaj zrenderowany.
Teraz krok po kroku.
Oczywiście możemy stworzyć nowy cel Dharmiczny.
W tym artykule Hanower.
Dodając tutaj nową stałą celu, która jest obiektem JavaScript, pomysłem może być liczba losowa.
Z losowym losowaniem.
To oczywiście nie jest naprawdę wyjątkowe I. RE. , ale jest wystarczająco dobry i przekonwertuję go na ciąg.
Jest wystarczająco dobry dla naszej aplikacji demo tutaj.
Mam na myśli.
A potem tekst tutaj będzie tekstem wprowadzonym tutaj przez użytkownika.
Na razie tylko tekst obojętny.
Mój nowy cel
Teraz mamy tutaj nowy cel.
I oczywiście możemy zablokować konsolę, aby zobaczyć, że wszystko do tej pory działa.
Więc jeśli to uratujemy.
Widzimy tutaj nasz formularz.
A jeśli klikniesz Dodaj cel, strona się nie przeładuje.
Zamiast tego widzimy tutaj cel znaczka.
Mógłby, oczywiście, stworzyć wiele celów.
Ale w tej chwili nie są dodawane do tej listy.
Aby dodać do listy, musimy teraz przenieść ten cel z nowego komponentu celu do komponentu aplikacji.
Teraz, zanim się nauczymy, możemy przekazać stan naszej rundy rekwizytów.
Ale to było od aplikacji do listy celów.
Tak więc do komponentu niższego poziomu, który jest częścią aplikacji.
Teraz jest inny kierunek.
Chcemy przekazać dane z nowego celu do komponentu nadrzędnego.
Więc komponent, który zawiera nowy komponent celu.
Jak to działa?