为什么Vuex状态变量似乎绑定到组件的局部变量？

时间：2019-12-09 02:35:12

标签： forms vue.js data-binding vuex

在我的Vue SPA中，我正在通过axios呼叫添加和删除主题。

在组件中，我将对象的（newCourse）属性绑定到不同的表单元素，如下所示。该对象被扔到函数中以创建新课程。到目前为止一切顺利。

local variables

enter image description here

enter image description here

以上... POST解决后，Vuex更改器通过将新课程推送到allCourses数组来提交新课程。到目前为止一切顺利。

enter image description here

当我尝试填写表格并创建另一门课程时遇到麻烦。当我更改表单时，提交的旧课程似乎正在更新/绑定到newCourse属性。

如果刷新页面然后更改表单，则一切都很好。

有人对发生的事情有任何想法吗？我宁愿不这样做，但我总是可以vm.$forceUpdate()。如果有人需要任何其他信息，我将尝试策划。

非常感谢！

编辑：以获取更多参考：可能与计算出的更新有某种关系？

enter image description here

根据要求，在下面存储/操作/更改...

enter image description here

1 个答案:

答案 0 :(得分：0)

enter image description here

谢谢@Steven B.的帮助！我花了很长时间在这上，这对我有很大帮助。上面是我创建单独对象以实现commit突变的地方。我想这可以防止数据绑定到组件对象和状态对象。

我不确定为什么不能创建新对象，但是将课程对象分配给空对象可以解决问题。

编辑：因为这个问题/答案似乎与javascript中的对象有关，所以这里是一个详细解释该主题的链接。

https://scotch.io/bar-talk/copying-objects-in-javascript

相关问题
最新问题