javascript - Vuex 渲染错误

Question

我目前正在使用 Vuex 和 Vue 建立一个项目，但遇到了一个奇怪的问题。我推测这与渲染的顺序有关，但在多次尝试更改代码但无济于事后，我仍然不确定。

我尝试的是使用父级中的 getter 来访问状态，并使用槽传递它，而不是直接在子级中传递，正如我将在此处发布的那样。

我尝试使用 $this.$store.state 传递值仍然未定义，但是在控制台使用实例上的方法记录它时，所有数据都在那里。

这是一个link我的代码。

那里的错误与我自己的控制台中的错误类似:

[Vue warn]: Error in render: "TypeError: Cannot read property 'state' of undefined"

预先感谢所有花时间查看它的人。

P.S:将其更改为 store.state.stake.value 后，内容会显示，但会出现另一个错误，即 [Vue warn]: Invalid handler for event "click": got undefined


Answer 1

强调文本在您的变更中，您将使用 this.$store.state 访问状态。这是错误的，因为 this 没有指向 vue 实例。

突变处理程序接收状态作为第一个参数:

myMutation(state){
    //use state argumentt to access state
}

这是updated code sandbox

还有一件事:mapMutations 是一个帮助器，它将组件方法映射到 store.commit 调用。因此，它们只是组件中的方法将其添加到 methods 选项，而不是 compulated，因为它们不计算任何内容