Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. Vue

Erstellen komplexer, umfangreicher Vue.js-Apps mit Vuex

by
Difficulty:AdvancedLength:LongLanguages:

German (Deutsch) translation by Alex Grigorovich (you can also view the original English article)

Es ist so einfach, Vue.js zu erlernen und zu verwenden, dass jeder mit diesem Framework eine einfache Anwendung erstellen kann. Sogar Anfänger können mit Hilfe der Dokumentation von Vue die Arbeit erledigen. Wenn jedoch Komplexität ins Spiel kommt, werden die Dinge etwas ernster. Die Wahrheit ist, dass mehrere tief verschachtelte Komponenten mit gemeinsam genutztem Status Ihre Anwendung schnell in ein nicht zu wartendes Chaos verwandeln können.

Das Hauptproblem in einer komplexen Anwendung besteht darin, den Status zwischen Komponenten zu verwalten, ohne Spaghetti-Code zu schreiben oder Nebenwirkungen zu verursachen. In diesem Tutorial erfahren Sie, wie Sie dieses Problem mithilfe von Vuex lösen können: einer Statusverwaltungsbibliothek zum Erstellen komplexer Vue.js-Anwendungen.

Was ist Vuex?

Vuex ist eine Zustandsverwaltungsbibliothek, die speziell für die Erstellung komplexer, umfangreicher Vue.js-Anwendungen optimiert wurde. Es verwendet einen globalen, zentralisierten Speicher für alle Komponenten in einer Anwendung und nutzt sein Reaktivitätssystem für sofortige Aktualisierungen.

Der Vuex-Speicher ist so konzipiert, dass es nicht möglich ist, seinen Status von einer Komponente aus zu ändern. Dies stellt sicher, dass der Zustand nur auf vorhersehbare Weise mutiert werden kann. Somit wird Ihr Geschäft zu einer einzigen Quelle der Wahrheit: Jedes Datenelement wird nur einmal gespeichert und ist schreibgeschützt, um zu verhindern, dass die Komponenten der Anwendung den Status beschädigen, auf den andere Komponenten zugreifen.

Warum brauchen Sie Vuex?

Sie fragen sich vielleicht: Warum brauche ich Vuex überhaupt? Kann ich den freigegebenen Status nicht einfach in eine reguläre JavaScript-Datei einfügen und in meine Vue.js-Anwendung importieren?

Sie können dies natürlich, aber im Vergleich zu einem einfachen globalen Objekt bietet der Vuex-Store einige wesentliche Vorteile und Nutzen:

  • Der Vuex-Store ist reaktiv. Sobald Komponenten einen Status daraus abrufen, aktualisieren sie ihre Ansichten jedes Mal, wenn sich der Status ändert.
  • Komponenten können den Status des Geschäfts nicht direkt ändern. Die einzige Möglichkeit, den Status des Geschäfts zu ändern, besteht darin, explizit Mutationen festzuschreiben. Dies stellt sicher, dass jede Statusänderung einen nachverfolgbaren Datensatz hinterlässt, wodurch das Debuggen und Testen der Anwendung einfacher wird.
  • Dank der Vuex-Integration mit der DevTools-Erweiterung von Vue können Sie Ihre Anwendung problemlos debuggen.
  • Im Vuex Store können Sie aus der Vogelperspektive sehen, wie alles in Ihrer Anwendung verbunden und beeinflusst ist.
  • Es ist einfacher, den Status zwischen mehreren Komponenten zu verwalten und zu synchronisieren, selbst wenn sich die Komponentenhierarchie ändert.
  • Vuex ermöglicht eine direkte komponentenübergreifende Kommunikation.
  • Wenn eine Komponente zerstört wird, bleibt der Status im Vuex-Speicher erhalten.

Erste Schritte mit Vuex

Bevor wir anfangen, möchte ich einige Dinge klarstellen.

Um diesem Tutorial folgen zu können, müssen Sie zunächst über ein gutes Verständnis von Vue.js und seines Komponentensystems verfügen oder zumindest über minimale Erfahrung mit dem Framework verfügen.

Das Ziel dieses Tutorials ist es auch nicht, Ihnen zu zeigen, wie Sie eine tatsächlich komplexe Anwendung erstellen. Ziel ist es, Ihre Aufmerksamkeit mehr auf Vuex-Konzepte zu richten und wie Sie sie zum Erstellen komplexer Anwendungen verwenden können. Aus diesem Grund werde ich sehr einfache Beispiele ohne redundanten Code verwenden. Sobald Sie die Vuex-Konzepte vollständig verstanden haben, können Sie sie auf jeder Komplexitätsstufe anwenden.

Schließlich werde ich die ES2015-Syntax verwenden. Wenn Sie nicht damit vertraut sind, können Sie es hier lernen.

Und jetzt fangen wir an!

Einrichten eines Vuex-Projekts

Der erste Schritt, um mit Vuex zu beginnen, besteht darin, Vue.js und Vuex auf Ihrem Computer zu installieren. Es gibt verschiedene Möglichkeiten, dies zu tun, aber wir werden die einfachste verwenden. Erstellen Sie einfach eine HTML-Datei und fügen Sie die erforderlichen CDN-Links hinzu:

Ich habe CSS verwendet, um die Komponenten besser aussehen zu lassen, aber Sie müssen sich nicht um diesen CSS-Code kümmern. Es hilft Ihnen nur, eine visuelle Vorstellung davon zu bekommen, was los ist. Kopieren Sie einfach Folgendes und fügen Sie es in das <head>-Tag ein:

Lassen Sie uns nun einige Komponenten erstellen, mit denen Sie arbeiten können. Geben Sie im <script>-Tag direkt über dem schließenden </body>-Tag den folgenden Vue-Code ein:

Hier haben wir eine Vue-Instanz, eine übergeordnete Komponente und zwei untergeordnete Komponenten. Jede Komponente hat die Überschrift "Score:", in der der App-Status ausgegeben wird.

Als letztes müssen Sie direkt nach dem Öffnen von <body> eine Umhüllung <div> mit id="app" einfügen und dann die übergeordnete Komponente darin platzieren:

Die Vorbereitungsarbeiten sind nun abgeschlossen und wir sind bereit, fortzufahren.

Vuex erkunden

Staatsverwaltung

Im wirklichen Leben beschäftigen wir uns mit Komplexität, indem wir Strategien verwenden, um die Inhalte zu organisieren und zu strukturieren, die wir verwenden möchten. Wir gruppieren verwandte Dinge in verschiedenen Abschnitten, Kategorien usw. Es ist wie in einer Buchbibliothek, in der die Bücher kategorisiert und in verschiedene Abschnitte unterteilt sind, damit wir leicht finden können, wonach wir suchen. Vuex ordnet die auf den Status bezogenen Anwendungsdaten und -logiken in vier Gruppen oder Kategorien ein: Status, Getter, Mutationen und Aktionen.

Zustand und Mutationen sind die Basis für jeden Vuex-Store:

  • state ist ein Objekt, das den Status der Anwendungsdaten enthält.
  • mutationen ist auch ein Objekt, das Methoden enthält, die den Zustand beeinflussen.

Getter und Aktionen sind wie logische Projektionen von Zustand und Mutationen:

  • getters enthalten Methoden, mit denen der Zugriff auf den Status abstrahiert und bei Bedarf einige Vorverarbeitungsjobs ausgeführt werden (Datenberechnung, Filterung usw.).
  • actions sind Methoden zum Auslösen von Mutationen und zum Ausführen von asynchronem Code.

Lassen Sie uns das folgende Diagramm untersuchen, um die Dinge etwas klarer zu machen:

Vuex State Management Workflow Diagram

Auf der linken Seite haben wir ein Beispiel für einen Vuex-Store, den wir später in diesem Tutorial erstellen werden. Auf der rechten Seite haben wir ein Vuex-Workflow-Diagramm, das zeigt, wie die verschiedenen Vuex-Elemente zusammenarbeiten und miteinander kommunizieren.

Um den Status zu ändern, muss eine bestimmte Vue-Komponente Mutationen festschreiben (z. B. this.$store.commit('increment', 3)), und dann ändern diese Mutationen den Status (score wird 3). Danach werden die Getter dank des reaktiven Systems von Vue automatisch aktualisiert und rendern die Aktualisierungen in der Ansicht der Komponente (mit this.$store.getters.score).

Mutationen können keinen asynchronen Code ausführen, da dies die Aufzeichnung und Verfolgung der Änderungen in Debug-Tools wie Vue DevTools unmöglich machen würde. Um asynchrone Logik zu verwenden, müssen Sie sie in Aktionen umsetzen. In diesem Fall sendet eine Komponente zuerst Aktionen aus (this.$store.dispatch('incrementScore', 3000)), in denen der asynchrone Code ausgeführt wird, und diese Aktionen legen dann Mutationen fest, die den Status mutieren.

Erstellen Sie ein Vuex Store-Skelett

Nachdem wir uns mit der Funktionsweise von Vuex befasst haben, erstellen wir das Skelett für unseren Vuex-Shop. Fügen Sie den folgenden Code über die Registrierung der ChildB-Komponenten ein:

Um von jeder Komponente aus globalen Zugriff auf den Vuex-Speicher zu gewähren, müssen Sie die store-Eigenschaft in der Vue-Instanz hinzufügen:

Jetzt können wir von jeder Komponente mit der Variablen this.$store auf den Speicher zugreifen.

Wenn Sie das Projekt bisher mit CodePen im Browser öffnen, sollte das folgende Ergebnis angezeigt werden.

App Skeleton

Zustandseigenschaften

Das Statusobjekt enthält alle gemeinsam genutzten Daten in Ihrer Anwendung. Natürlich kann bei Bedarf jede Komponente auch ihren eigenen privaten Status haben.

Stellen Sie sich vor, Sie möchten eine Spielanwendung erstellen und benötigen eine Variable, um die Punktzahl des Spiels zu speichern. Also legst du es in das Staatsobjekt:

Jetzt können Sie direkt auf die Punktzahl des Staates zugreifen. Kehren wir zu den Komponenten zurück und verwenden Sie die Daten aus dem Geschäft erneut. Um reaktive Daten aus dem Status des Geschäfts wiederverwenden zu können, sollten Sie berechnete Eigenschaften verwenden. Erstellen wir also eine berechnete Eigenschaft von score() in der übergeordneten Komponente:

Fügen Sie in die Vorlage der übergeordneten Komponente den Ausdruck {{ score }} ein:

Machen Sie jetzt dasselbe für die beiden untergeordneten Komponenten.

Vuex ist so schlau, dass es die ganze Arbeit für uns erledigt, die score-Eigenschaft reaktiv zu aktualisieren, wenn sich der Status ändert. Versuchen Sie, den Wert der Punktzahl zu ändern, und sehen Sie, wie das Ergebnis in allen drei Komponenten aktualisiert wird.

Getters erstellen

Es ist natürlich gut, dass Sie das Schlüsselwort this.$store.state in den Komponenten wiederverwenden können, wie Sie oben gesehen haben. Stellen Sie sich aber folgende Szenarien vor:

  1. In einer umfangreichen Anwendung, in der mehrere Komponenten mithilfe dieser Datei auf den Status des Geschäfts zugreifen. this.$store.state.score, möchten Sie den Namen der score ändern. Dies bedeutet, dass Sie den Namen der Variablen in jeder Komponente ändern müssen, die sie verwendet!
  2. Sie möchten einen berechneten Wert des Status verwenden. Angenommen, Sie möchten den Spielern einen Bonus von 10 Punkten geben, wenn die Punktzahl 100 Punkte erreicht. Wenn die Punktzahl 100 Punkte erreicht, werden 10 Punkte Bonus hinzugefügt. Dies bedeutet, dass jede Komponente eine Funktion enthalten muss, die die Punktzahl wiederverwendet und um 10 erhöht. Sie haben in jeder Komponente wiederholten Code, was überhaupt nicht gut ist!

Glücklicherweise bietet Vuex eine funktionierende Lösung für solche Situationen. Stellen Sie sich den zentralisierten Getter vor, der auf den Status des Geschäfts zugreift und eine Getter-Funktion für alle Elemente des Status bereitstellt. Bei Bedarf kann dieser Getter einige Berechnungen auf das Element des Status anwenden. Und wenn Sie die Namen einiger Eigenschaften des Staates ändern müssen, ändern Sie sie nur an einer Stelle, in diesem Getter.

Lassen Sie uns einen score() getter erstellen:

Ein Getter empfängt den state als erstes Argument und verwendet ihn dann, um auf die Eigenschaften des Status zuzugreifen.

Hinweis: Getter erhalten auch getters als zweites Argument. Sie können es verwenden, um auf die anderen Getter im Geschäft zuzugreifen.

Ändern Sie in allen Komponenten die berechnete Eigenschaft score(), um den score()-Getter anstelle der Bewertung des Status direkt zu verwenden.

Wenn Sie nun entscheiden, die score in result zu ändern, müssen Sie sie nur an einer Stelle aktualisieren: im score()-Getter. Probieren Sie es in diesem CodePen aus!

Mutationen erstellen

Mutationen sind der einzig zulässige Weg, um den Zustand zu ändern. Das Auslösen von Änderungen bedeutet einfach, Mutationen in Komponentenmethoden zu begehen.

Eine Mutation ist so ziemlich eine Ereignishandlerfunktion, die durch den Namen definiert wird. Mutationshandlerfunktionen erhalten als erstes Argument einen state. Sie können auch ein zusätzliches zweites Argument übergeben, das als payload für die Mutation bezeichnet wird.

Erstellen wir eine increment()-Mutation:

Mutationen können nicht direkt aufgerufen werden! Um eine Mutation durchzuführen, sollten Sie die Methode commit() mit dem Namen der entsprechenden Mutation und möglichen zusätzlichen Parametern aufrufen. Es kann nur einer sein, wie in unserem Fall der step, oder es können mehrere in ein Objekt eingewickelt sein.

Verwenden wir die increment()-Mutation in den beiden untergeordneten Komponenten, indem wir eine Methode mit dem Namen changeScore() erstellen:

Wir begehen eine Mutation, anstatt diese direkt zu ändern. this.$store.state.score, da wir die durch die Mutation vorgenommene Änderung explizit verfolgen möchten. Auf diese Weise machen wir unsere Anwendungslogik transparenter, nachvollziehbarer und leichter zu überlegen. Darüber hinaus können Tools wie Vue DevTools oder Vuetron implementiert werden, mit denen alle Mutationen protokolliert, Status-Snapshots erstellt und Zeitreise-Debugging durchgeführt werden können.

Lassen Sie uns nun die Methode changeScore() verwenden. Erstellen Sie in jeder Vorlage der beiden untergeordneten Komponenten eine Schaltfläche und fügen Sie einen Listener für Klickereignisse hinzu:

Wenn Sie auf die Schaltfläche klicken, wird der Status um 3 erhöht, und diese Änderung wird in allen Komponenten berücksichtigt. Jetzt haben wir effektiv eine direkte komponentenübergreifende Kommunikation erreicht, die mit dem in Vue.j integrierten Mechanismus "Requisiten runter, Ereignisse hoch" nicht möglich ist. Schauen Sie sich das in unserem CodePen-Beispiel an.

Aktionen erstellen

Eine Aktion ist nur eine Funktion, die eine Mutation festlegt. Es ändert den Status indirekt, wodurch asynchrone Operationen ausgeführt werden können.

Erstellen wir eine incrementScore()-Aktion:

Aktionen erhalten den context als ersten Parameter, der alle Methoden und Eigenschaften aus dem Speicher enthält. Normalerweise extrahieren wir nur die Teile, die wir benötigen, indem wir die Destrukturierung von ES2015-Argumenten verwenden. Die commit-Methode ist eine, die wir sehr oft brauchen. Aktionen erhalten ebenso wie Mutationen ein zweites Nutzlastargument.

Ändern Sie in der ChildB-Komponente die Methode changeScore():

Um eine Aktion aufzurufen, verwenden wir die dispatch()-Methode mit dem Namen der entsprechenden Aktion und zusätzlichen Parametern, genau wie bei Mutationen.

Jetzt erhöht die Schaltfläche Punktzahl ändern der ChildA-Komponente die Punktzahl um 3. Die identische Schaltfläche der ChildB-Komponente führt dasselbe aus, jedoch nach einer Verzögerung von 3 Sekunden. Im ersten Fall führen wir synchronen Code aus und verwenden eine Mutation, im zweiten Fall führen wir asynchronen Code aus und müssen stattdessen eine Aktion verwenden. Sehen Sie in unserem CodePen-Beispiel, wie das alles funktioniert.

Vuex Mapping Helfer

Vuex bietet einige nützliche Hilfsprogramme, mit denen der Prozess der Erstellung von Status, Getter, Mutationen und Aktionen optimiert werden kann. Anstatt diese Funktionen manuell zu schreiben, können wir Vuex anweisen, sie für uns zu erstellen. Mal sehen, wie es funktioniert.

Anstatt die berechnete Eigenschaft score() wie folgt zu schreiben:

Wir verwenden einfach den mapState() - Helfer wie folgt:

Und die Eigenschaft score() wird automatisch für uns erstellt.

Gleiches gilt für die Getter, Mutationen und Aktionen.

Um den score() - Getter zu erstellen, verwenden wir den mapGetters() - Helfer:

Um die changeScore()-Methode zu erstellen, verwenden wir den mapMutations()-Helfer wie folgt:

Bei Verwendung für Mutationen und Aktionen mit dem Nutzlastargument müssen wir dieses Argument in der Vorlage übergeben, in der wir den Ereignishandler definieren:

Wenn changeScore() eine Aktion anstelle einer Mutation verwenden soll, verwenden wir mapActions() wie folgt:

Auch hier müssen wir die Verzögerung im Ereignishandler definieren:

Hinweis: Alle Mapping-Helfer geben ein Objekt zurück. Wenn wir sie also in Kombination mit anderen lokal berechneten Eigenschaften oder Methoden verwenden möchten, müssen wir sie zu einem Objekt zusammenführen. Glücklicherweise können wir dies mit dem Objektverbreitungsoperator (...) ohne Verwendung eines Dienstprogramms tun.

In unserem CodePen sehen Sie ein Beispiel dafür, wie alle Mapping-Helfer in der Praxis verwendet werden.

Den Store modularer gestalten

Es scheint, dass das Problem mit der Komplexität uns ständig den Weg versperrt. Wir haben es zuvor gelöst, indem wir den Vuex-Store erstellt haben, in dem wir die Statusverwaltung und die Komponentenkommunikation vereinfacht haben. In diesem Geschäft haben wir alles an einem Ort, leicht zu manipulieren und leicht zu überlegen.

Mit dem Wachstum unserer Anwendung wird diese einfach zu verwaltende Speicherdatei jedoch immer größer und daher schwieriger zu warten. Auch hier benötigen wir einige Strategien und Techniken zur Verbesserung der Anwendungsstruktur, indem wir sie in ihre einfach zu wartende Form zurückversetzen. In diesem Abschnitt werden wir verschiedene Techniken untersuchen, die uns bei diesem Vorhaben helfen können.

Verwenden von Vuex-Modulen

Mit Vuex können wir das Store-Objekt in separate Module aufteilen. Jedes Modul kann seinen eigenen Status, Mutationen, Aktionen, Getter und andere verschachtelte Module enthalten. Nachdem wir die erforderlichen Module erstellt haben, registrieren wir sie im Store.

Lassen Sie es uns in Aktion sehen:

Im obigen Beispiel haben wir zwei Module erstellt, eines für jede untergeordnete Komponente. Die Module sind nur einfache Objekte, die wir als scoreBoard und resultBoard im modules objekt im Store registrieren. Der Code für childA ist der gleiche wie der im Store aus den vorherigen Beispielen. Im Code für childB fügen wir einige Änderungen an Werten und Namen hinzu.

Lassen Sie uns nun die childB-Komponente optimieren, um die Änderungen im resultBoard-Modul widerzuspiegeln.

In der ChildA-Komponente müssen wir nur die changeScore()-Methode ändern:

Wie Sie sehen können, ist das Geschäft durch die Aufteilung in Module viel leichter und wartbarer, während die hervorragende Funktionalität erhalten bleibt. Schauen Sie sich den aktualisierten CodePen an, um ihn in Aktion zu sehen.

Namespace-Module

Wenn Sie ein und denselben Namen für eine bestimmte Eigenschaft oder Methode in Ihren Modulen verwenden möchten oder müssen, sollten Sie in Betracht ziehen, diese mit einem Namespace zu versehen. Andernfalls können seltsame Nebenwirkungen auftreten, z. B. das Ausführen aller Aktionen mit demselben Namen oder das Abrufen der Werte für den falschen Status.

Um einem Vuex-Modul einen Namespace zu geben, setzen Sie einfach die namespace-Eigenschaft auf true.

Im obigen Beispiel haben wir die Eigenschafts- und Methodennamen für die beiden Module gleich gemacht. Und jetzt können wir eine Eigenschaft oder Methode verwenden, der der Name des Moduls vorangestellt ist. Wenn wir beispielsweise den score()-Getter aus dem resultBoard-Modul verwenden möchten, geben wir ihn folgendermaßen ein: resultBoard/score. Wenn wir den score()-Getter aus dem scoreBoard-Modul haben möchten, geben wir ihn folgendermaßen ein: scoreBoard/score.

Lassen Sie uns nun unsere Komponenten ändern, um die von uns vorgenommenen Änderungen widerzuspiegeln.

Wie Sie in unserem CodePen-Beispiel sehen können, können wir jetzt die gewünschte Methode oder Eigenschaft verwenden und das erwartete Ergebnis erzielen.

Aufteilen des Vuex-Speichers in separate Dateien

Im vorherigen Abschnitt haben wir die Anwendungsstruktur in gewissem Maße verbessert, indem wir den Speicher in Module unterteilt haben. Wir haben das Geschäft übersichtlicher und übersichtlicher gestaltet, aber der gesamte Geschäftscode und seine Module befinden sich immer noch in derselben großen Datei.

Der nächste logische Schritt besteht also darin, den Vuex-Speicher in separate Dateien aufzuteilen. Die Idee ist, eine individuelle Datei für das Geschäft selbst und eine für jedes seiner Objekte, einschließlich der Module, zu haben. Dies bedeutet, dass separate Dateien für den Status, Getter, Mutationen, Aktionen und für jedes einzelne Modul (store.js, state.js, getters.js usw.) vorhanden sind. Ein Beispiel für diese Struktur finden Sie am Ende des nächsten Sektion.

Verwenden von Vue-Einzeldateikomponenten

Wir haben den Vuex-Store so modular wie möglich gestaltet. Als nächstes können wir dieselbe Strategie auch auf die Vue.js-Komponenten anwenden. Wir können jede Komponente in eine eigenständige Datei mit der Erweiterung .vue einfügen. Informationen zur Funktionsweise finden Sie auf der Dokumentationsseite zu Vue Single File Components.

In unserem Fall haben wir also drei Dateien: Parent.vue, ChildA.vue und ChildB.vue.

Wenn wir schließlich alle drei Techniken kombinieren, erhalten wir die folgende oder eine ähnliche Struktur:

In unserem Tutorial GitHub Repo sehen Sie das abgeschlossene Projekt mit der obigen Struktur.

Rekapitulieren

Lassen Sie uns einige wichtige Punkte zusammenfassen, an die Sie sich bei Vuex erinnern müssen:

Vuex ist eine Zustandsverwaltungsbibliothek, mit der wir komplexe, umfangreiche Anwendungen erstellen können. Es verwendet einen globalen, zentralisierten Speicher für alle Komponenten in einer Anwendung. Um den Zustand zu abstrahieren, verwenden wir Getter. Getter ähneln weitgehend berechneten Eigenschaften und sind eine ideale Lösung, wenn wir zur Laufzeit etwas filtern oder berechnen müssen.

Der Vuex-Speicher ist reaktiv und Komponenten können den Status des Speichers nicht direkt ändern. Die einzige Möglichkeit, den Status zu mutieren, besteht darin, Mutationen festzuschreiben, bei denen es sich um synchrone Transaktionen handelt. Jede Mutation sollte nur eine Aktion ausführen, muss so einfach wie möglich sein und ist nur für die Aktualisierung eines Teils des Zustands verantwortlich.

Asynchrone Logik sollte in Aktionen gekapselt werden. Jede Aktion kann eine oder mehrere Mutationen festschreiben, und eine Mutation kann von mehr als einer Aktion begangen werden. Aktionen können komplex sein, ändern jedoch niemals direkt den Status.

Schließlich ist Modularität der Schlüssel zur Wartbarkeit. Um mit Komplexität umzugehen und unseren Code modular zu gestalten, verwenden wir das "Divide and Conquer" -Prinzip und die Code-Splitting-Technik.

Abschluss

Das ist schon die Ende! Sie wissen schon die Hauptkonzepte von Vuex und können sie in der Praxis anwenden.

Der Kürze und Einfachheit halber habe ich absichtlich einige Details und Funktionen von Vuex weggelassen. Sie müssen daher die vollständige Vuex-Dokumentation lesen, um alles über Vuex und seine Funktionen zu erfahren.

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.