Vue-------响应数据变化

1. 对象的响应数据变化

        <div id="app">
            <h1>{{msg}}</h1>
            <h2>{{person.name}}</h2>
        </div>

        let vm = new Vue({
            el:'#app',
            data:{
                msg:'hello',
                person:{

                }
            }
        })

如上代码所示，未给person对象添加属性name,现要在外部添加name属性并赋值。

静态方法是挂载在函数上的方法，调用的时候通过函数调用

原型上的方法,需要通过实例调用

a.调用Vue的静态方法set ,语法Vue.set(taget,prop,value)

Vue.set(vm.person,'name','我叫pika')

b.调用实例方法，与静态方法一致

vm.$set(vm.person,'name','我叫pika')

2. 数组的响应数据变化

a)、 提供观察数组的变异方法，使用这些方法将会触发视图更新

        push()、pop()、shift()、unshift()、splice()、sort()、reverse()

b)、不能触发视图更新

       利用索引直接设置一个项时

        vm.list[0] = 1000;  //更改不了
        vm.list.splice(0,1,1000)  //可以更改

       修改数组长度时