Den Monat speichern

Der letzte Schritt: Die App muss sich den Monat merken. Im Moment ist mit einem Klick auf Ausführen oder einem Neuladen der Seite jede Ausgabe weg.

Die Aufgabe. Speichere die Ausgaben jedes Mal, wenn sich die Liste ändert, in localStorage unter dem Schlüssel ausgaben und lies sie beim Start der App wieder ein, sodass die Liste und alle Summen sie wieder zeigen. Füge dann unter den Summen einen Button mit der ID neuer-monat und dem Text Neuer Monat hinzu: Ein Klick darauf leert die Liste zum Beginn eines neuen Monats, und die leere Liste bleibt auch gespeichert.

Ein Tipp: Ein Watcher kann nach jeder Änderung speichern, egal, was sie ausgelöst hat. push() ändert das Array von innen, also braucht der Watcher { deep: true }. Setze den Button außerhalb des Formulars: Ein Button in einem Formular schickt es ab.

Das ist das ganze Projekt. Deine App prüft, was in ein Formular getippt wird, führt eine Liste, zählt sie auf drei Arten mit berechneten Werten zusammen, die immer aktuell sind, und merkt sich den Monat mit einem einzigen Watcher im Browser. In der nächsten Lektion, Komponenten, lernst du, eine App wie diese in kleinere Teile aufzuteilen, jeder in einer eigenen Datei.