2017-05-10 4 views
0

Ich versuche, meine erste Vue.js CRUD-Anwendung mit Vuex zu erstellen, und ich stehe in einem Kampf mit dem Laden des Zustands.Ladezustand für CRUD in Vue.js

Ich habe eine Route, die alle Konten /accounts auflistet und ich bin leicht laden Konten für alle Konten in einer Liste Form.

Meine Herausforderung/Frage, wie kann ich effektiv Status verwenden, um einen einzelnen Datensatz in einer anderen Route anzuzeigen/zu aktualisieren? (dh. /accounts/1). Wenn der Benutzer den Browser unter /accounts/1 aktualisiert, habe ich keinen Status. Was ist die beste Strategie, um den Status sowohl für eine Sammlung von Dingen als auch für einen einzelnen Datensatz in dieser Sammlung zu verwalten?

+0

Ich bin mir nicht sicher, ob ich dein Problem verstehe. Verwenden Sie VueX, um Ihren Status zu verwalten? – Cobaltway

+0

Ja, ich benutze vuex, ich habe die Frage aktualisiert –

Antwort

0

Wenn Sie den Status nach einem Neuladen beibehalten möchten, sollten Sie sicherstellen, dass der Status im lokalen Speicher gespeichert ist. Stellen Sie dann sicher, dass Sie die Daten über Lifecycle-Hooks entsprechend laden. Versuchen Sie vue-localstorage

+0

Der Titel und die Beschreibung meiner Frage sind für CRUD, so dass Speichern im lokalen Speicher nicht ideal ist. Ich brauche frische Daten von einer API (Datenbank), um vorhandene Datensätze zu aktualisieren. –

1

Sie können einen Blick auf https://github.com/JiriChara/vuex-crud. Es erstellt Restful Vuex Module mit allen Aktionen: CRETE, READ, UPDATE, DELETE. Der Quellcode ist ziemlich einfach, so dass Sie sehen können, wie der Status entworfen und geändert wird.