我有一个具有以下渲染(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>
implementation的store看起来像这样,将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