vue响应式理解

本文是个人对vue响应式的理解,如果有错误欢迎大家指正

阅读本文前请大家仔细理解官网中的响应式内容

https://cn.vuejs.org/v2/guide/reactivity.html

https://cn.vuejs.org/v2/guide/components.html#data-%E5%BF%85%E9%A1%BB%E6%98%AF%E4%B8%80%E4%B8%AA%E5%87%BD%E6%95%B0

 

响应式,官网的说法是:当你把一个普通的 JavaScript 对象传给 Vue 实例的 data 选项,Vue 将遍历此对象所有的属性,并追踪等。。。

我个人总结的是:未响应过的数据在第一次放到data选项中会被遍历然后进行追踪,给已经追踪过的数据添加新的属性如果不按照官网说的方式,则新加的属性不会被追踪

响应的时候只要有一个被响应的属性值改变就会重载一次数据,请看vue生命周期图 下图(when data changes)

vue响应式理解_第1张图片

下面粘出我的测试代码

在Child文件中






在父组件中Parent文件

 






以上就是我个人的理解以及相关测试,如有理解错误欢迎指正

你可能感兴趣的:(javaweb,vue)