Start a stop

Čas na projekt! V tomto miniprojektu postavíte stopky: měří čas v desetinách sekundy, zastaví se a zase rozběhnou, vrátí se na nulu a měří kola. Stejně jako v předchozích miniprojektech pokyny říkají, co má aplikace dělat, a jak to napíšete, je na vás. Každé cvičení pokračuje tam, kde skončilo to předchozí.

Stránka. App.jsx obsahuje části stopek, které zatím nic nedělají: čas 0.0 v odstavci s třídou cas a tlačítko Start.

Úkol. Kliknutí na Start stopky spustí: čas na stránce roste po desetinách sekundy (0.0, 0.1, 0.2… 12.3) a na tlačítku je Stop. Kliknutí na Stop čas zastaví a na tlačítku je zase Start. Další Start pokračuje od času, na kterém se stopky zastavily.

Tipy:

• Čas mějte ve stavu jako celé číslo desetin: 123 znamená 12,3 sekundy. Ukažte ho pomocí (desetiny / 10).toFixed(1). toFixed(1) převede číslo na text s jednou číslicí za desetinnou tečkou: (123 / 10).toFixed(1) je "12.3" a (10 / 10).toFixed(1) je "1.0".
• Jestli stopky běží, je další stavová proměnná, true, nebo false.
• Interval patří do efektu, který závisí na tom, jestli stopky běží. Když neběží, efekt nic neudělá a skončí pomocí return. Když běží, efekt spustí interval, který tikne každých 100 milisekund, a vrátí úklid, který ho zastaví. Kliknutí na Stop změní stav a React zavolá úklid dřív, než efekt spustí znovu.