V tomto cvičení zařídíme, že uživatel bude moci napsat slovo zobrazené na obrazovce.
- Udělejte si fork repozitáře se zadáním celého projektu. Nainstalujte závislosti a prohlédněte si strukturu projektu. Po spuštění stránky uvidíte na obrazovce jedno slovo vykreslené pomocí komponenty
Wordbox
. - Prostudujte si zdrojový kód a seznamte se s tím, jak aplikace funguje.
- Prohlédněte si kompnentu
Stage
. Prozatím si nevšímejte funkcegenerateWord
, tu máme připravenou na později. Ve stavu komponenty nemáme uložen jen jeden řetězec ale celé pole slov. To je také příprava na později. Dokud neřekneme jinak, budeme pracovat s jednoprvkovým polem. - Upravte komponentu
Wordbox
tak, že pověsíte posluchače událostikeyUp
nadocument
. Pokud uživatel napsal správně první písmenko slova, toto písmenko ze slova umažte. Takto pokračujte dokud uživatel nenapíše celé slovo. V posluchači budete používat stavlettersLeft
a bude potřeba se vyhnout jeho zastarávání (stale state). Použijte probíranou techniku, kdy posluchače události měníte svépomocí. Do závislostíuseEffectu
bude potřeba přidat stavlettersLeft
. - Jakmile uživatel napíše správně celé slovo, na stránce zůstane viset prázdná komponenta
Wordbox
. Nechejte ji zatím viset.