vue检测数组与对象的更新

• 因为vue是响应式的，所以当数据发生变化时vue会自动更新视图中的数据。

• vue中包含了一组观察数组编译的方法，使用它们更新数组也会触发视图的更新。

  data:{

  text 代码:

   arr:['a','b','c']，
   obj:{
      name:"xiu",
   }

  }

push()：在数组最后添加元素

this.arr.push("newEle")
this.arr.push("newEle1"，"newEle2"，"newEle2")

pop()：删除数组最后一个元素

this.arr.pop()

shift()：删除数组第一个元素

this.arr.shift()

unshift()：在数组最前面添加元素

this.arr.unshift()
this.arr.unshift("newEle1"，"newEle2"，"newEle3")

splice()：添加/删除/替换元素

添加：splice(开始位置的索引,0,...要添加的元素)

• this.arr.splice(0,0,"newEle1","newEle2"...)

删除：splice(开始位置的索引,要删除几个元素)

• this.arr.splice(0,2)

替换：splice(开始位置的索引,替换元素的个数,...替换的元素)

• this.arr.splice(0,2,"newEle1","newEle2"...)

sort()：排序

this.arr.sort()

reverse()：反转

this.arr.reverse()

注意！！！通过索引修改元素不是响应式的

this.arr[0] = "newEle"

注意！！！修改数组长度不是响应式的

this.arr.length = newLength

Vue.set():修改/添加数组元素或对象的属性
对于已经创建的实例，Vue 不允许动态添加根级别的响应式属性。但是，可以使用 Vue.set(object, propertyName, value) 方法向嵌套对象添加响应式属性。

修改或添加数组元素：Vue.set(this.arr,2,"newEle")
修改或添加对象属性：Vue.set(this.obj,"age","21)