vue 数据对象内部属性变化 dom无法更新视图问题(elementui tree组件修改节点数据无法更新视图的问题)

在vue项目中应用elementUI框架的时候,发现绑定数据data的chilidren数据变化时,在组件视图中没有监测到和更新,导致的一些问题,需要解决;

各种查找相关问题解决方法后,知道了产生问题的原因并做了相应处理,作为记录,以备后面再次遇到问题时,能够快速定位解决;

产生原因:
在vue文档中有这样一句话:由于 JavaScript 的限制,Vue 不能检测数组和对象的变化。尽管如此我们还是有一些办法来回避这些限制并保证它们的响应性。
响应式检测变化注意事项.

所以知道了,是由于vue的原因产生的这个问题;

解决办法:
在分析原因之后得出结论如果使数据的变化可以被检测到,那么视图就会更新。
于是参照一些博客中的方法,对数据进行如下处理:

this.treeData=JSON.parse(JSON.stringify(this.treeData)

在对属性控件的数据进行修改之后,给数据深拷贝处理一下,视图就可以进行相应的更新了;

到此,问题也算可以解决了,不过处理的不是很优雅,等后面再遇到时,有时间详细研究一下更好的处理方法。

你可能感兴趣的:(vue 数据对象内部属性变化 dom无法更新视图问题(elementui tree组件修改节点数据无法更新视图的问题))