Vuex Getters 以未定义的形式回归答案

【问题标题】：Vuex Getters Come Back as UndefinedVuex Getters 以未定义的形式回归
【发布时间】：2019-06-24 08:13:48
【问题描述】：

我遇到了一个 Vuex getters 问题，其中 gitters 返回未定义（在 Vue 开发控制台中，并且在 Chrome 开发控制台中没有记录任何错误）。

如果mapGetters() 被注释掉（如下面的示例代码），则返回的数据将显示在屏幕上 -> 提供用户是否点击了包含该数据的链接。如果用户直接在数据应该显示的地方进入应用程序，数据将不会显示。

有一个similar question，但没有接受的答案

Vue 控制台日志：

状态：

$_lgdHRS:对象

totHrs:129

吸气剂：

$_lgdHRS/totHrs:未定义

SomeContainer.vue

<script>
import store from '../../_store'
import { mapState, mapGetters } from 'vuex'

export default {
  computed: {
    ...mapState('$_lgdHRS',{
      totHrs : 'totHrs',
    }),

  // ...mapGetters('$_lgdHRS',{
  //    totHrs  : 'totHrs',
  //    airHrs  : 'airHrs',
  //    picHrs  : 'picHrs',
  //    pmcHrs  : 'pmcHrs',
  //    voHrs   : 'voHrs',
  //    trngHrs : 'trngHrs'
  // }),
  },

  created() {
    this.storeKey = '$_lgdHRS';
      if (!(this.storeKey in this.$store._modules.root._children)) {
        this.$store.registerModule(this.storeKey, store);
    }
  },

  mounted() {
    this.$store.dispatch('$_lgdHRS/getLogSummary');
  },
}
</script>
<template>
    <total-summary :hours="totHrs" />
</template>

state.js

export const state = {
  totHrs: Number,
}

getters.js

const totHrs = state => state.totHrs;
export default {
  totHrs,
};

mutations.js

const
TOTAL_HRS_UPDATED = (state, totHrs) => {
  state.totHrs = +totHrs;
};
export default {
    TOTAL_HRS_UPDATED,
};

【问题讨论】：

另外，初始视图中未显示的数据是否与lifecycle 有关，并且仅在从另一个路由状态进入时才显示？？

标签： vuejs2 store vuex vuex-modules

【解决方案1】：

很可能是因为您刚刚在mounted 中分发了请求，并且在将数据设置到状态变量之前，您的组件就会显示出来。因此，您可以尝试在挂载和存储操作中使用异步等待。请参考以下链接并检查最后一个示例。 https://vuex.vuejs.org/guide/actions.html

【讨论】：

【解决方案2】：

问题是我像往常在其他框架中一样嵌套了我的变量。

例子：

// NESTED VARS
const r = response
      totHrs  = r.total,
      airHrs  = r.airborne,
      picHrs  = r.PIC,
      pmcHrs  = r.PMC,
      voHrs   = r.VO,
      trngHrs  = r.training;

// CHANGE TO:
const r = response
const totHrs  = r.total
const airHrs  = r.airborne
const picHrs  = r.PIC
const pmcHrs  = r.PMC
const voHrs   = r.VO
const trngHrs = r.training

我不知道为什么，但您的意见将在 cmets 中受到高度赞赏。

【讨论】：