如何解决vue-更改localstate会触发vuex错误
每当我更新本地状态时,即使我什至没有尝试更改vuex存储,vuex也会引发错误[vuex] do not mutate vuex store state outside mutation handlers.
。有什么问题吗?
data: {
selected: []
},methods: {
addItem(item){
this.selected.push({
name: item.name,count: item.count
})
},applySelected(){
this.$store.dispatch('changeItems',this.selected)
}
}
<button @click="item.count++"/>
<span>{{item.count}}</span>
<button @click="item.count--"/>
项目处于循环中,但该示例不需要适当的标记和周围的代码。 现在,当selected []为空时,当我执行addItem(item)时,它可以正常工作。然后,当我更改计数时,它仍然可以正常工作。当我将更改提交到商店时,请猜测一下-它仍然可以正常工作。但是,当我尝试将更改提交给商店后更改计数时,即使我有0个getter且根本不读取商店,每当我尝试更改selected []项目的计数时,都没有任何其他的变异/调度调用,它会引发vuex错误。但是为什么呢?
解决方法
更改组件中的vuex状态没有任何意义。最好通过突变来更改它。
但是有一种本地解决方法,您必须调用一个函数,该函数返回vuex存储中项的新对象。也许像这样:
computed: {
selected() {
return () => this.$store.state.selected
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。