Skrývání a odebírání

Některé věci nakonec potřebovat nebudete: máte zamluvenou chatu, takže stan může zůstat doma. A když je většina věcí zabalená, chcete vidět jen to, co ještě zbývá.

Odebírání. Dejte každé věci druhé tlačítko, Odebrat, které ji ze seznamu odebere. Změní se i počet: když není nic zabalené, odebrání stanu ho změní na Zabaleno 0 / 6.

Skrývání. Nad seznam přidejte tlačítko Skrýt zabalené. Kliknutí na něj zabalené věci skryje a na tlačítku pak bude Ukázat zabalené. Kliknutí na ně je zase ukáže. Skryté věci jsou pořád na seznamu, jen nejsou vidět, takže je počet pořád počítá. A věc, kterou zabalíte, když jsou zabalené věci skryté, hned zmizí.

Tip: v refu si pamatujte, jestli jsou zabalené věci skryté. A nezapomeňte, že v-if a v-for nikdy nepatří na stejný prvek: nechte v-for procházet pole, které vrátí funkce, buď se všemi věcmi, nebo jen s těmi, které ještě nejsou zabalené.

To je celý projekt. Váš seznam na výlet je udělaný z dat: z pole veci a z refu, který říká, jestli jsou zabalené věci skryté. Každé kliknutí změní data a Vue aktualizuje všechno, co z nich vzniká: seznam, tlačítka, přeškrtnuté věci, počet i zprávu. Stránku jste ani jednou neměnili sami pomocí textContent, jako v kurzu JavaScriptu. V další lekci, Formuláře, necháte uživatele psát: jména, poznámky a volby půjdou pomocí v-model rovnou do refů a formulář bude přidávat nové objednávky do seznamu.