Verständnis von vue-Router und Dateneigenschaften

Question

Ich habe eine Situation, wo, wenn ich auf eine Route navigieren, meinen berechnete Eigenschaft Updates und aktualisiere meine Ansicht entsprechend. Wenn ich zu einer anderen Route und zurück wechsle - verliere ich alle meine Daten, die in diesem Bereich zugewiesen sind. Ich verwende created, um diese Variablen zu initialisieren, und navigiere dann zurück, um sie auf einen Null-Zustand neu zu initialisieren.

In meinem berechneten Eigenschaft, ich bevölkern diese (erstellt Variablen) und diese werden in der Ansicht verwendet.

Meine Frage ist - ist die Reinitialisierung normal? Gehe ich das falsch?

created: function() { 
      this.abc = {}; 
    }, 
    computed: { 
     myData: function() { 
      return this.$store.state.myData; 
     }, 
     setupData: function() { 
      console.log('only update now!') 
      var myData = this.myData; 

      //doSomething that updates this.abc 
     } 
    }, 
    watch: { 
     myData: { 
      handler: function(newValue) { 
       this.setupData(newValue); 
      }, 
      deep: true 
     } 
    }, 

Answer 1

Ja, die Neuinitialisierung ist normal. Wenn Sie Ihre Komponente behalten möchten, verwenden Sie die keep-alive tag:

Wenn Sie die Switched-out-Komponenten im Speicher behalten wollen, so dass Sie können ihren Zustand erhalten oder erneutes Rendern zu vermeiden, können Sie eine dynamische wickeln Komponente in einem Element:

<keep-alive> 
    <component :is="currentView"> 
    <!-- inactive components will be cached! --> 
    </component> 
</keep-alive> 

die Dokumentation über die <router-view> auch refers to it:

Da es nur eine Komponente ist, funktioniert es mit <transition> und <keep-alive>.