Shrnutí

V této lekci jste se naučili, že:

• Ref vytvoříte pomocí useRef(null) a prvku ho dáte pomocí ref={jmenoRef}. Jakmile je prvek na stránce, React ho uloží do jmenoRef.current, takže obsluhy událostí a efekty mohou volat jeho metody, třeba jmenoRef.current.focus().
• Ref udrží jakoukoli hodnotu od jednoho vykreslení k dalšímu a změna ref.current nové vykreslení nespustí. Patří do něj věci, které potřebuje jen váš kód, třeba id intervalu. Co ukazuje stránka, patří do stavu.
• Vlastní hook je funkce, jejíž název začíná na use a která volá jiné hooky. Mezi komponentami sdílí kód, ne stav: každá komponenta, která ho volá, dostane vlastní. Hook bez JSX patří do souboru s příponou .js.
• useLocalStorage(klic, vychoziHodnota) funguje jako useState a hodnotu si pamatuje v localStorage. useFetch(adresa) načte soubor a vrátí { data, nacitani, chyba }.
• Pravidla hooků: volejte je jen na nejvyšší úrovni komponent a hooků, nikdy v podmínkách, cyklech ani obsluhách událostí, a vždy ve stejném pořadí. Předčasný návrat patří až za všechny hooky.

V další lekci, Závěrečný projekt, využijete celý kurz v aplikaci s kartičkami na učení slovíček a uvidíte, jak dělat aplikace v Reactu na vlastním počítači.

Nejdřív si ale vše procvičte na festivalové vstupence s vaším jménem, kterou si aplikace zapamatuje, a na tlačítku, které dá kurzor do textového pole se jménem. useLocalStorage.js je hook, který jste napsali, připravený k použití.