Odebrání koupených položek
Seznam si teď pamatuje všechno, i to, co jste koupili minulý týden. Po nákupu se hodí odškrtnuté položky odklidit, a tak k tomu aplikace dostane tlačítko Odebrat koupené.
Tlačítko patří do stránky, takže tentokrát upravíte i index.html, o jeden řádek. Skript pak tlačítko najde pomocí document.querySelector(), stejně jako ostatní prvky.
Jak se koupených položek zbavit? Metodou filter() z lekce o metodách polí. Projde pole a vytvoří nové, ve kterém jsou jen prvky, pro které její funkce vrátí true. Tady chcete nechat položky, které koupené nejsou:
polozky = polozky.filter((polozka) => !polozka.koupeno);Metoda filter() původní pole nemění. Vrátí nové a kód ho uloží do polozky, a proto se hodí, že je polozky vytvořené pomocí let. Seznam se změnil, takže obsluha pak udělá totéž co ostatní obsluhy po změně: seznam uloží a zobrazí.
Typická chyba je napsat polozky.filter(...) na samostatný řádek, bez polozky =. Nové pole vznikne a hned se zapomene, takže seznam zůstane, jaký byl.
Jak psát:
Pokyny
V index.html přidejte pod odstavec s částkou k zaplacení tlačítko: <button id="odebrat">Odebrat koupené</button>. Ve script.js ho najděte pod ostatními prvky: const tlacitkoOdebrat = document.querySelector("#odebrat");.
Po kliknutí na tlacitkoOdebrat nechte v polozky jen položky, které nejsou koupené, pak seznam uložte pomocí ulozPolozky() a zobrazte pomocí zobrazPolozky(). Vyzkoušejte to: chléb zmizí, a když kód spustíte znovu, už se nevrátí.