关于前端:vueset动态更新对象数组

vue 双向绑定原理是通过 Object.defineProperty()来对对象的 setter 和 getter 属性进行操作。
为了保障视图动静更新须要给对象加上 get 和 set 办法来进行双向绑定。

1. 动静更新对象
给 man 增加 age 属性
错误方法：
add(){
this.man.age = ’22’
console.log(this.man)
},

正确办法：
add(){
this.$set(this.man,’age’,’22’)
console.log(this.man)
},

2. 动静更新数组
给 man 增加增加学生小陈的信息
student:[

{name:'小红',age:'12'},
{name:'小李',age:'15'},

]
小陈：{name:’ 小陈 ’,age:’13’}

错误方法：
add(){
let schen = {name:’ 小陈 ’,age:’13’}
this.student[2] = schen
console.log(this.student)
},

正确办法：
add(){
let schen = {name:’ 小陈 ’,age:’13’}
this.$set(this.student,2,schen)
console.log(this.student)
}