2

我第一次在“功能范围结构”中使用 Vuex 商店，并且一直难以追踪为什么我得到一个[vuex] unknown getter: $_kp/kp- （除了引用的错误之外，Vue/Vuex 并没有对此产生太大影响）。

更新：我打开store.subscribeAction()看看是否放弃了更多信息。这是打印的日志（我没有看到任何有用的信息，但希望对您有所帮助）。

动作类型：$_kp/getKpIndex

动作负载：未定义

当前状态：{ ob : Observer} $_kp: Object kp: "2" //<- 这就是我想要得到的——“2”！

UPDATE-2：我现在也在使用 Vues Inspector，它显示以下内容：

| State
| - $_kp: object
  | - kp: "3"

| Mutation
| - payload: "3"
| - type: "$_kp/KP_DATA_UPDATED"

非常感谢您对此提供的任何帮助，我希望这对以这种方式设置商店的人有用。

SomeElement.vue：

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

export default {
  name  : 'KpIndexElement',
  parent: 'AVWX',

  computed: {
    ...mapGetters({
      kp: '$_kp/kp', //<-- HERE?
    }),
  },

  created() {
    const STORE_KEY = '$_kp';
    if (!(STORE_KEY in this.$store._modules.root._children)) {//<= I think there is an issue with this too
      this.$store.registerModule(STORE_KEY, store);
    }
  },

  mounted() {
    this.$store.dispatch('$_kp/getKpIndex');
  },
}
</script>

<template>
  <p><strong>Kp: </strong>{{ kp }}</p>
</template>

商店index.js

import actions      from './actions';
import getters      from './getters';
import mutations    from './mutations';

var state = {
    kp: '',
};

export default {
    namespaced: true,
    state,
    actions,
    getters,
    mutations,
};

动作.js：

import api from '../_api/server';

const getKpIndex = (context) => {
  api.fetchKpData
  .then((response) => {
    console.log('fetch response: ' + response)
    context.commit('KP_DATA_UPDATED', response);
  })
  .catch((error) => {
    console.error(error);
  })
}

export default {
  getKpIndex,
}

突变.js

const KP_DATA_UPDATED = (state, kp) => {
  state.kp = kp;
}

export default {
  KP_DATA_UPDATED,
}

...最后是getters.js

const kp = state => state.kp;

export {
  kp,
};
4

1 回答 1

1

使用命名空间时的语法mapGetters如下：

...mapGetters('namespace', [
    'getter1',
    'getter2',
    ... // Other getters 
])

在你的情况下：

...mapGetters('$_kp', [
    'kp'
])

第一个参数是命名空间，第二个参数是包含您要使用的 getter 的有效负载。

此外，正如@Ijubadr 的评论中所指出的，我不确定mapGetters在您注册store模块后是否进行了评估。要解决这个问题，您可能必须放弃使用mapGetters并将您声明STORE_KEY为数据，然后STORE_KEY在其定义中定义一个计算getter using（我storeKey在下面的示例中将其重命名，因为这不再是一个常量）：

computed: mapState('$_kp',{
  kpIndex: 'kp'
}),

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

mounted() {
  this.$store.dispatch('$_kp/getKpIndex');
}
于 2019-01-23T07:21:26.533 回答