getter/state未在初始时间vuej上调用

ecbunoof  于 2022-12-14  发布在  Vue.js
关注(0)|答案(1)|浏览(137)

我尝试将函数返回到计算属性中,但在页面刷新时getter或state没有将数据加载到计算属性中。如何解决此问题?我也尝试将async await导入计算属性,但它不起作用。请指导。

export default {
    data(){
        return {
            isLoading: false,
        }
    },
    async created(){
        await this.profile()
    },
    methods: {
        async profile(){
            this.isLoading = true;
            return await Promise.all([
                this.$store.dispatch('class'),
                this.$store.dispatch('list')
            ]).finally(() => {
                this.isLoading = false;
            })
        }
    },
    computed: {
        getItem() {
            console.log(this.$store.getters); //This records did not load at first time after rerouting it does work
            return () => this.$store.getters.listItem;
        }
        
    }
}
gajydyqb

gajydyqb1#

我不明白为什么你需要从计算值返回一个函数。但是,在你的模板中使用计算值是可行的。

<template>
  <div>
    {{ getItem() }}
  </div>
</template>

但是如果您想查看控制台日志,可以使用本地变量强制Vue查看更改。

computed: {
  getItem() {
    const lst = this.$store.getters.listItem;
    console.log(lst);
    return () => lst;
  },
},

我觉得还不如直接用储值。

computed: {
  getItem() {
    return this.$store.getters.listItem;
  },
},

相关问题