Javascript 列表isn'；t在vue.js中动态显示

我是vue.js新手，通过vue文档、youtube视频等自学。我已经搜索了一段时间，查看了youtube教程，到目前为止还没有找到答案，希望你们能帮助我

这是我的问题，我正在构建一个web应用程序，我需要动态显示一个对象列表，但它不会显示我第一次加载该页面的时间。我必须走另一条路回来看看，所以我想我误解了某个生命周期或某个专业领域的东西

我正在使用vuex存储和检索我的数据，如下所示：

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 => {
                commit('GET_LIST', res.data)
            })
            .catch((err) => console.log(err))
    }
};



export default {
    state,
    getters,
    mutations,
    actions
};

然后我在我的vue中得到这样的结果：

<template>
  <v-container>
      <v-card v-for="heure in heures" :key="heure._id">
        <v-card-title>{{ heure }}</v-card-title>
      </v-card>
  </v-container>
</template>

<script>
export default {
  name: "TimeList",
  data() {
    return {
      heures: this.$store.getters.getJourneeList,
    }
  },
  created() {
    this.$store.dispatch('getJourneesUser');
  }
}
</script>

{{heure}}
导出默认值{
名称：“时间主义者”，
数据（）{
返回{
heures:这个.$store.getters.getJourneeList，
}
},
创建（）{
这是.store.dispatch（'getJourneesUser'）；
}
}

您需要使用mapState并在计算值内使用它，因为这样计算值将响应状态的变化。您不需要getter，但如果您需要，这里是带有getter的版本。如果您的存储模块名为journees，则应该是这样的：

无吸气剂

{{heure}}
从“vuex”导入{mapState}；
导出默认值{
名称：“时间主义者”，
计算：{
…mapState（[“journees”]）
},
创建（）{
此.$store.dispatch（“getJourneesUser”）；
},
};

带吸气剂

<template>
    <v-container>
        <v-card v-for="heure in getJourneeList" :key="heure._id">
            <v-card-title>{{ heure }}</v-card-title>
        </v-card>
    </v-container>
</template>

<script>
import { mapGetters } from "vuex";
export default {
    name: "TimeList",
    computed: {
        ...mapGetters(["getJourneeList"])
    },
    created() {
        this.$store.dispatch("getJourneesUser");
    },
};
</script>

{{heure}}
从“vuex”导入{mapGetters}；
导出默认值{
名称：“时间主义者”，
计算：{
…映射获取程序（[“getJourneeList”]）
},
创建（）{
此.$store.dispatch（“getJourneesUser”）；
},
};

您可以检查两件事，首先尝试console.log（heures）并查看您在控制台中获得的数据类型。其次，journees是否应该是一种数组类型而不是对象？我已经将console.log放在了所有地方，它按照预期首先进入我的created（）函数，然后在执行mutator之前装入它。即使我的大问题是为什么完成后不更新。。。关于对象/数组的问题，我不确定它是否真的重要，因为我是在那个状态下施法的。journees是一个新对象，应该会删除最后一个对象，或者可能我搞错了。。。我对承诺的使用也很陌生，所以也许我做的不止一件事是错误的。。。