Aus dem Kurs: Vue.js Grundkurs

So erhalten Sie Zugriff auf diesen Kurs

Werden Sie noch heute Mitglied und erhalten Sie Zugriff auf mehr als 23.200 Kurse von Branchenfachleuten.

Challenge: To-do-Liste erstellen

Challenge: To-do-Liste erstellen – Tutorial zu Vue.js

Aus dem Kurs: Vue.js Grundkurs

Gratismonat starten Für Ihr Team erwerben

Challenge: To-do-Liste erstellen

“

Damit ist ein guter Zeitpunkt für eine Challenge gekommen, in der Sie einzelne Features von Vue anwenden können. Es geht eine To-do-Liste. Ich kann neue Punkte hinzufügen. Ich bin gerade einfallslos: "Noch was". Ich gehe dann auf die Eingabetaste und das erscheint hier. Ich kann kennzeichnen, dass ich etwas erledigt habe. Wir sehen, unten wird ausgegeben, wie viele Aufgaben ich noch zu tun habe. Außerdem kann ich auch einzelne Sachen löschen. Das Ganze wird im Local Storage gespeichert. Ich gehe einmal im Firefox auf Webspeicher und dann den Local Storage und dann sehen wir, das sind die Daten die gespeichert werden, d.h., bei jedem Task gibt es einen Text und es gibt die Angabe "completed": false oder eben nicht false und das ist im Local Storage gespeichert. Was brauchen Sie für die Aufgabe? Nutzen Sie doch ref() für einzelne neue Aufgaben und reactive() für die gesamte Liste. Dann müssen Sie natürlich auf verschiedene Events reagieren. Eine neue Aufgabe soll hinzugefügt werden…

Inhalt