我有一个具有以下渲染(computed props)的组件。它可以正常工作并显示blopp所需的文本,但不显示blipp。在最终版本中,我希望它产生一个从商店状态带来的字符串列表,并用作blipp。

export default {
  computed:{
    blopp: function(){ return "ghjk,l"; },
    blipp: function(){ return this.$store.getters.getBlipp(); }
  }
}


它是根据以下template呈现的。

<template>
  <div>
    ...
    <div v-bind:blopp="blopp">{{blopp}}</div>
    <div v-bind:blipp="blipp">{{blipp}}</div>
  </div>
</template>


implementationstore看起来像这样,将getters带到了开放论坛。

...
const state = { blipp: [], ... };
const getters = {
  getBlipp: function() { return state.Blipp; }, ...
}
export default new Vuex.Store({ state, mutations, actions, getters });


第二个组件根本没有任何价值,我不确定在哪里寻找原因。

我可能将其设置不正确,但其中有很多活动部件,很难为无知的我进行诊断。当我尝试在控制台中运行以下命令时,


  临时$ store.getters


我得到一个列出这样的吸气剂的对象。

...
blipp:(...)
get blipp: function()
__proto__: Onject


不确定如何处理该信息...它似乎是一个函数,但是当我尝试调用它时,它说是不确定的。

最佳答案

吸气剂的功能类似于状态。因此,要解决它们,您可以调用参数而不是方法,即

blipp: function() { return this.$store.getters.getBlipp }


在这种情况下,您可能想将getBlipp重命名为blipp

我整理了一个JSFiddle,它展示了您可以与vuex商店交互的各种方式,希望对您有所帮助:

Example Vuex JSFiddle

09-25 13:04