Leniwe ładowanie komponentów w React dzięki import

Ten wpis jest 31 częścią z 31 w kursie React.js

Czy w React da się ładować komponenty leniwie? A więc masz już sporą aplikację. Chcesz ją jakoś zoptymalizować. Do głowy przychodzi Ci, oczywiście, podział jej na kilka części, które będą ładowane na żądanie, dopiero gdy będą potrzebne — tzw. lazy load. Z pomocą przychodzi operator import(…) — po prostu! Operator import(…) Składni import something from ‚something’ używasz na pewno codziennie. W skrócie, powoduje ona, że dana zależność …

Nowe metody cyklu życia: getDerivedStateFromProps i getSnapshotBeforeUpdate

Ten wpis jest 30 częścią z 31 w kursie React.js

Od wersji React 16.3 funkcje componentWillMount, componentWillReceiveProps i componentWillUpdate zostają oznaczone jako deprecated. Pojawiają się też dwie nowe metody cyklu życia: getDerivedStateFromProps i getSnapshotBeforeUpdate. Co to dla nas oznacza? Do czego one służą? Jak ich używać?

Formularze w React.js — niekontrolowane komponenty

Ten wpis jest 21 częścią z 31 w kursie React.js

Część druga formularzy w React.js — tym razem formularze tak zwane „niekontrolowane” — czyli Uncontrolled Components. Czym są i jak się ich używa? No i po co Ci w ogóle formularze niekontrolowane w React.js? Niekontrolowane formularze — Uncontrolled Components W większości przypadków poleca się używanie jednak kontrolowanych formularzy. Jak już wcześniej pisałem, w kontrolowanych formularzach to React jest jedynym źródłem danych i tylko React kontroluje …

Formularze w React.js — kontrolowane komponenty

Ten wpis jest 20 częścią z 31 w kursie React.js

Dzisiaj zajmiesz się imlementacją formularzy w React.js. Już wcześniej dokonywałaś/eś interakcji z polami formularza — ale raczej w prosty sposób. Dzisiaj o formularzach kontrolowanych w React.js Kontrolowane formularze w React.js Kontrolowane komponenty w React.js (Controlled Components) — to takie komponenty, których wewnętrzny stan jest kontrolowany przez Reacta. O czym mówię? Weźmy prosty kod: <input onChange={this.handleChange} /> Ten input nie jest kontrolowany przez Reacta dlatego, że jego …

Testowanie React.js w Enzyme — props, state i interakcje

Ten wpis jest 15 częścią z 31 w kursie React.js

Pokazałem już jak pisać proste testy do aplikacji React.js z użyciem Enzyme. Sprawdzanie czy coś się renderuje, czy zawiera tekst, czy dobrze pokazuje elementy… W tym wpisie idę o krok dalej. Pokazuję jak w Enzyme testować interakcje z komponentami, odczytywać i zmieniać propsy a także state.