每日一点热知识：Vue 不允许动态添加根级别的响应式

之前写vue前端代码，发现修改表单值的输入视图不进行更新，也不知道什么原因，只能莫名其妙的将每个添加一个监听事件，监听数据变化用this.$forceUpdate()强制更新。今天去看Vue的官方文档，盲生发现了花点。
深入响应式原理
原本以为是数据遍历层数太多，例如a.b.c,可能无法更新，今天看到了文档说
property 必须在 data 对象上存在才能让 Vue 将它转换为响应式把这些 property 全部转为 getter/setter。

必须在初始化实例前声明所有根级响应式 property，哪怕只是一个空值
这样对于后面接手这个项目的开发人员也能更清晰的了解到这个页面拥有哪些数据。

原理：
队列中循环，同一个watch被触发只会被放入队列中一次，去除重复渲染的数据，减少计算和DOM操作。