响应式数据

一、响应式数据的概述

当一个vue实例被创建时，这个实例下data选项下存在的property都会被加入到Vue的响应式系统中，当这些property发生改变时，视图就会发生享用的改变。

但是后加入的property不会被加入到Vue的响应式系统中。

二、响应式数据

1、我们知道，vue实例中的data选项中的数据（property）是响应式的，也就是vue会实时监听data的数据变化并返回给视图层，并且存在于data选项下的数据也存在于vue实例下，即：vm.a == data.a; // true

2、所以，当这些数据发生改变时，视图会重新渲染。但是我们需要注意的是，只有在实例被创建时就存在的数据才是响应式的数据，才会被监听，后面加入的数据发生改变时不会触发任何视图的更新，例如，我们后加入一个数据：data.b = 2; // 这个数据不会被监听

3、如果我们知道我们在晚些时候会需要一个数据加入进来，但是一开始他并不存在或为空，那么我们仅需要设置一些初始值。

4、Object.freeze()

如果我们不想要data里面的数据变成响应式数据，我们可以使用Object.freeze(data)的方法将data数据冻结起来

三、响应式无效的情况

1、直接修改数组的长度；

2、通过数组索引改变数组项

3、直接在外面给对象添加新属性