对于已经创建的实例，Vue 不允许动态添加根级别的响应式 property。

    对于对象，直接添加属性是无效的
    官网例子：

    1. var vm = new Vue({
    2.   data:{
    3.     a:1
    4.   }
    5. })
    7. // `vm.a` 是响应式的
    9. vm.b = 2
    10. // `vm.b` 是非响应式的，添加无效

    有两种方式能动态添加

    1. Vue.set(object, propertyName, value)  //第一种
    2. //实例代码
    3. Vue.set(vm.someObject, 'b', 2)
    5. vm.$set(object,propertyName,value)  //第二种
    6. //实例代码
    7. this.$set(this.someObject,'b',2)

    对于数组，无法直接设置数组项、设置数组长度
    官网例子：

    1. var vm = new Vue({
    2.   data: {
    3.     items: ['a', 'b', 'c']
    4.   }
    5. })
    6. vm.items[1] = 'x' // 不是响应性的
    7. vm.items.length = 2 // 不是响应性的

    两种方式可以解决设置数组项

    1. // Vue.set
    2. Vue.set(vm.items, indexOfItem, newValue)
    4. // Array.prototype.splice
    5. vm.items.splice(indexOfItem, 1, newValue)

    用splice可以解决更新length的问题

    1. vm.items.splice(newLength)

    Vue实现动态添加的原理
    Vue 将遍历对象所有的 property，并使用 Object.defineProperty 把这些 property 全部转为 getter/setter。这些gettter和setter可以让Vue追踪依赖，在 property 被访问/修改时通知变更。