Ich habe einen Listen-/Detail-Anwendungsfall, in dem der Benutzer auf ein Element in einer Produktliste doppelklicken kann, zum Detailbildschirm zum Bearbeiten gehen und dann zum Listenbildschirm zurückkehren kann, wenn sie fertig sind. Ich habe dies bereits mit der hier beschriebenen Technik der dynamischen Komponenten getan: https://vuejs.org/v2/guide/components.html#Dynamic-Components. Aber jetzt, wo ich vue-Router an anderer Stelle in der Anwendung verwenden möchte, möchte ich dies umgestalten, stattdessen Routing zu verwenden. Mit meiner Dynamic-Component-Technik habe ich Keep-Alive verwendet, um sicherzustellen, dass beim Wechsel des Benutzers zur Listenansicht dieselbe Auswahl wie vor der Bearbeitung vorhanden war. Aber mir scheint, dass mit dem Routing die Produktlistenkomponente neu gerendert würde, was ich nicht will.Komponentenstatus mit Vue-Router beibehalten?
Jetzt sieht es so aus, als könnte router-view in keep-alive eingepackt werden, was ein Problem lösen würde, aber viele andere einführen würde, da ich nur diese Route am Leben erhalten möchte, nicht alle (und derzeit m nur eine einzige Top-Level-Router-Ansicht verwenden). Vue 2.1 hat eindeutig etwas getan, um dies zu beheben, indem es Ein- und Ausschlussparameter für Router-View einführte. Aber ich will das auch nicht wirklich machen, denn es scheint sehr klobig zu sein, auf meiner Hauptseite alle Routen zu deklarieren, die keep-alive verwenden sollten oder sollten. Es wäre viel vernünftiger zu deklarieren, ob ich an dem Punkt, an dem ich die Route konfiguriere (d. H. Im routes-Array), am Leben bleiben möchte. Also, was ist meine beste Option?
Sicher, ich bin mir dessen bewusst, dass mit einem Geschäft außerhalb der beiden Komponenten, ich den Zustand der Listenkomponente erhalten kann, dann ‚wiederherstellen‘ es, wenn ich zurück. Aber es gibt eine Menge von Daten, die ich behalten müsste, und nicht alles ist Teil der tatsächlichen Komponentendaten (wie zum Beispiel Scroll-Position in der Tabelle). Ich hatte gehofft, es gäbe einen netten Weg, um es überhaupt nicht rendern zu müssen. –
@JohnMoore haben Sie die Lösung gefunden? Ich habe dieselbe genaue Frage. – andy
Was ich die Informationen am Ende dabei war die Isolierung I zwischen den verschiedenen Ansichten zu bewahren benötigt und es als ‚workingProductData‘ in einem Vuex Speicher zu speichern. Fummeliger als ideal, aber es funktioniert. Eine einfachere Lösung, die ich in einem anderen Projekt angenommen wird, ist das Detail und die Auflistung Ansichten als Teil derselben Komponente haben, schaltete nach einer ‚editMode‘ Eigenschaft in Staat, mit v-if/v-else. –