没有完全遵循 MVVM 模型(●'◡'●)

只有当实例被创建时 data 中存在的属性才是响应式的

也就是说如果你添加一个新的属性，比如： vm.b = 'hi' 那么对 b 的改动将不会触发任何视图的更新。如果你知道你会在晚些时候需要一个属性， 但是一开始它为空或不存在，那么你仅需要设置一些初始值

<button v-bind:disabled="isButtonDisabled">Button</button>

如果 isButtonDisabled 的值是 null、undefined 或 false，则 disabled 特性甚至不会被包含在渲染出来的 <button> 元素中。

计算属性是基于它们的响应式依赖进行缓存的

有相同父元素的子元素必须有独特的 key。重复的 key 会造成渲染错误

变异方法 (mutation method)，顾名思义，会改变被这些方法调用的原始数组。相比之下，也有非变异 (non-mutating method) 方法，例如：filter(), concat() 和 slice() 。这些不会改变原始数组，但总是返回一个新数组。当使用非变异方法时，可以用新数组替换旧数组：

由于 JavaScript 的限制，Vue 不能检测以下变动的数组： 当你利用索引直接设置一个项时，例如：vm.items[indexOfItem] = newValue 当你修改数组的长度时，例如：vm.items.length = newLength

第一种情况的解决方案Vue.set(vm.items, indexOfItem, newValue) 或者 vm.items.splice(indexOfItem, 1, newValue) 或者 vm.$set(vm.items, indexOfItem, newValue)

第二种情况解决方案：vm.items.splice(newLength)

对于已经创建的实例，Vue 不能动态添加根级别的响应式属性。但是，可以使用 Vue.set(object, propertyName, value) 方法向嵌套对象添加响应式属性

或者：vm.$set(vm.userProfile, 'age', 27)

给对象添加多个属性：vm.userProfile = Object.assign({}, vm.userProfile, {
age: 27,
favoriteColor: 'Vue Green'
})

在默认情况下，v-model 在每次 input 事件触发后将输入框的值与数据进行同步 (除了上述输入法组合文字时)。你可以添加 lazy 修饰符，从而转变为使用 change 事件进行同步