W poprzednim rozdziale „WPROWADZENIE DO REACT JS” opisałem podstawy biblioteki, m.in budowę komponentów funkcyjnych i argumenty przekazywane do nich. Teraz zajmiemy się klasami, są one ciekawsze 🙂 i posiadają większe możliwości, np: definiowanie wewnętrznego stanu komponentu, funkcji pomocniczych, pozwalają tworzyć interakcje, reagować na zdarzenia itd.

Przykład:

Klasa Hello dziedziczy (extends) po React.component.
Funkcja render() zwraca nagłówek <h1> z wartością argumentu message:

Słowo kluczowe this odwołuje się do argumentu wewnątrz obiektu, który go wywołał. Może to być również odwołanie do funkcji: this.MyFunction, do stanu: this.state itp. To standardowy zapis 😉 i będziesz go często stosował kodując w ReactJS.

Przy użyciu ReactDOM wyświetlamy komponent <Hello /> przekazując mu argument message z treścią powitania: „Hello World!”

Czytaj dalej: „STATE – WEWNĘTRZNY STAN KOMPONENTU”