Please enable JavaScript.
Coggle requires JavaScript to display documents.
ReactMiętka (State (Przechowuje stan komponentu, W komponentach klasowych,…
ReactMiętka
State
-
-
-
-
Sam w sobie jest niemutowalny, a setState podmienia stary state na nowy :open_mouth:
Jeżeli chcemy dostać się do poprzedniej wartości możemy zrobić to w ten sposób
this.setState(prevState => ({ counter: prevState.counter + 1 }))
Jeżeli chcemy zmienić stan w komponencie rodzicu możemy do tego użyć propsa z funkcją
Propsy
-
-
Możemy przekazywać nimi praktycznie wszystko (tekst, liczby, tablice, obiekty, funkcje)
Możemy za ich pomocą wpływać na wygląd, zachowanie, zawartość komponentów
-
-
-
Wygląda jak HTML, smakuje jak HTML, ale to pyszne obiekty JavaScriptowe (pod spodem :stuck_out_tongue:)
Każdy tag musi być zamknięty np.
<Komponent></Komponent>
, <p></p>
lub w skróconej wersji "self-closing tags"
np. <img />
, <Komponent />
Pozwala na mieszanie JavaScriptu i HTMLa. Żeby dostać się do zmiennej z JS lub wykorzystać jakąś funkcję np. map() wystarczy użyć klamer { }
-
Struktura projektu
Mimo, że można pisać wiele komponentów w jednym pliku to warto zawsze wydzielać je do własnych plików .js. Dzięki temu już z poziomu drzewa folderów widzimy jakie komponenty mamy do dyspozycji :)
-
-
Komponenty
Funkcyjne
Nie posiadają state-u (obecnie rozwijane są hooki, które na takowy pozwalają, ale to będzie poruszane w przyszłości)
-
-
-