首页 > 解决方案 > vue getter 没有在应用程序启动时首次加载,并且仅在之后加载

问题描述

当我加载一个在计算属性中返回一个 id 的 getter 时。我尝试在一个方法中打印“id”,当应用程序加载时,id 值第一次为空。但是,当我编辑文件并保存时,我可以看到这个 id 正在控制台中打印。或者当我执行 1 秒的 setTimeout 时,我可以看到吸气剂。

这个“id”值很重要,我想作为全局变量访问。我希望它在应用加载时立即访问作物 ID。因为基于这个值,我将进行一些 api 调用。

作物 ID 是根据 api 调用的结果设置的。

store.commit("setCropId", list.id);

我的vuex

state:{
    crop: ""
},
mutations: {
    setCropId(state, value) {
      state.crop = value;
    }
},
actions:{
    actionCropId ({ commit }, value) {
     commit('setCropId', value)
    }
},
getters: {
    getCropId: state => {
      return state.crop;
    }
}

我的 Vue 组件

import { mapGetters } from "vuex";
  computed: {
    ...mapGetters([
      'getCropId',
    ])
  },
  mounted() {
    this.myCrops();
  },
  methods: {
    async myCrops() {
     console.log('my crops', getCropId)
     // other logic
    }
  }

我不知道如何使它工作。请建议我是否做错了什么或如何在应用加载时立即获取 getter。

谢谢

标签: vue.jsgetter

解决方案


推荐阅读