title: List isn't dynamically displayed in vue.js
body: <p>I'm new to vue.js and learning on my own with the vue doc, youtube videos and such. I've been searching for a while and looking at youtube tutorials and haven't found an answer so far, hope you guys will be able to help me.</p>
  <p>So here's my issue, I'm building a web app and I need to display a list of objects dynamically but it doesn't show the first time I'm loading that page. I have to go to some other route and come back to see it, so I guess I'm misunderstanding some life cycle or something from that field of expertise...</p>
  <p>I'm using the vuex to store and retrieve my data as seen below :</p>
  <pre><code>import Vue from 'vue';
  
  const state = {
  
      journees: {},
  };
  
  const getters = {
  
      getJourneeList(state) {
          return state.journees;
      }
  };
  
  const mutations = {
     
      GET_LIST(state, journees) {
          state.journees = journees;
      }
  };
  
  const actions = {
  
      getJourneesUser({commit}) {
          Vue.axios.get('/journee/')
              .then( res =&gt; {
                  commit('GET_LIST', res.data)
              })
              .catch((err) =&gt; console.log(err))
      }
  };
  
  
  
  export default {
      state,
      getters,
      mutations,
      actions
  };
  </code></pre>
  <p>And then I'm getting it in my vue like this:</p>
  <pre><code>&lt;template&gt;
    &lt;v-container&gt;
        &lt;v-card v-for=&quot;heure in heures&quot; :key=&quot;heure._id&quot;&gt;
          &lt;v-card-title&gt;{{ heure }}&lt;/v-card-title&gt;
        &lt;/v-card&gt;
    &lt;/v-container&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
    name: &quot;TimeList&quot;,
    data() {
      return {
        heures: this.$store.getters.getJourneeList,
      }
    },
    created() {
      this.$store.dispatch('getJourneesUser');
    }
  }
  &lt;/script&gt;
  </code></pre>