V tomto cvičení vdechneme život aplikaci, která umožňuje vybrat si různé ingredience na objednávanou pizzu. Uživatel uvidí seznam ingrediencí a bude moci si zaškrtnout, které ingredience chce na své pizze.
- Naklonujte si repozitář se zadáním projektu. Prohlédněte si strukturu kódu a vyzkoušejte si fungování aplikace.
- Budeme chtít abychom dokázali zobrazit počet zašrktnutých ingrediencí a jejich celkovou cenu. Všimněte si, že komponenta
Check
je uncontrolled, spravuje tedy svůj vlastní stav. - Jako první krok povyšte stav komponenty
Check
o jednu úroveň nahoru, tedy do komponentyTopping
. KomponentaCheck
tak bude mít propschecked
aonChange
. - Abychom dokázali zobrazit počet zaškrnutých ingrediencí, bude potřeba povýšit stav až do komponenty
ToppingsSelect
. Podobně jako v lekci k tomu využijte připravené pole toppings. Každý objekt obsahuje vlastnostselected
, který by se měla měnit v závislosti na tom, co uživatel zaškrtnul. - Rozšiřte aplikaci tak, aby zobrazovala také celkovou cenu.