8、响应数据变化

1、对象的响应数据变化

　　只有在data里面初始化的数据才能实现响应式

　　data中的数据都会被转换为getter/setter,所以当数据变化时，自动更新在页面中

　　如果没有定义某个属性，那么就不能检测属性的变化

let vm = new Vue({
     el:‘#app‘,
     data:{
         msg:‘hello‘,
         objPrev:{} 
     } 
})

vm.objPrev = ‘后来改变的数据‘;
//此时改变此数据是不会产生页面中响应式变化的

如果想要实现响应式，需要一下方式

　　1）Vue.set(target,key,value)，静态方法set, 函数上挂载的方法称为静态方法，静态方法通过函数调用，原型实例上的方法叫原型方法，原型方法必须通过实例调用

　　　　这个方法主要用于避开Vue不能检测属性被添加的限制

　　2）vm.$set(target,key,value)

　　　　实例上的方法

　　3）替换对象,直接给对象赋值

　　　　vm.objPrev = obj

　　　　Object.assign()直接合并的对象是不响应的，assign返回的是第一个参数对象

　　　　注意对象不能是Vue实例，或者Vue实例的根数据对象　　

　　　　vm.objPrev = Object.assign({ },vm.objPrev,{abc:456}) //重新赋值一个新的对象，vue才会重新更新视图，赋值的同一个对象是不会更新视图的

2、数组的响应数据变化

数据劫持：将数据劫持之后，使用Object.defineProperty方法给数据加上getter和setter，形成响应式的数据

let vm = new Vue({
     el:‘#app‘,
     data:{
         list:[1,2,3]
     } 
})

vm.list.push(1000);
//此处的push是变异方法，不是原生的，是vue内部把push改写了，这叫数据劫持

8、响应数据变化

原文：https://www.cnblogs.com/gopark/p/11363086.html