vue数据响应式

理解数据Data

ES6中的getter和setter能够对属性进行新的读写。vue实例中的data并非源数据库中的data.而是经过getter/setter处理之后，能够被vue进行代理/监听的data.并且，这个data还存有一个bug。就是vue只能监听第一层对象中的属性，如：data:{a:{b:{0} } }中，vue不能监听对象a中的对象b。另外，如果data想要定义一个新的属性xxx，Object.defineProtety(data,'xxx',{value:0})来为对象data新增一个key为xxx，值为0的虚拟属性。Vue 中，用于设置data中的新增的key的API是：Vue.set(object,key,value)或vm.$set(object,key,value)。

getter和setter

obj={
   firstName : '马',
   lastName:'青云',
    get name(){
    return this.firstName + this.lastName
    },
    //getter就是在函数名前面加上get
    set name(name){
      this.firstName = name[0]
      this.lastName = name.substring(1)
      }
      //setter就是在函数名前面加上set
},
console.log(obj.name)

obj.name='刘诗诗'//注意是直接赋值，调用了setter
console.log(obj.firstName)
console.log(obj.firstName + obj.lastName)

数据响应式

简言之，响应式就是对外界刺激作出反应。数据响应式就是对于data的任何改变，视图都会随着更新。vm=new vue({}),vm会对vue实例进行监控，并随着数据的改变而更新。