1）Vue.set 响应式新增与修改数据
可以设置对象或数组的值，通过key或数组索引，可以触发视图更新

target：要更改的数据源(可以是对象或者数组)
key：要更改的具体数据
value ：重新赋的值
①数组修改

Vue.set(array, indexOfItem, newValue)
this.array.$set(indexOfItem, newValue)

②对象修改

Vue.set(obj, keyOfItem, newValue)
this.obj.$set(keyOfItem, newValue)

2）Vue.delete
删除对象或数组中元素，通过key或数组索引，可以触发视图更新

①数组修改

 Vue.delete(array, indexOfItem)
 this.array.$delete(indexOfItem)

②对象修改

Vue.delete(obj, keyOfItem) 
this.obj.$delete(keyOfItem) 

3）数组对象直接修改属性，可以触发视图更新

this.array[0].show = true; 
this.array.forEach(function(item){
	 item.show = true;
 }); 

4）splice方法修改数组，可以触发视图更新

this.array.splice(indexOfItem, 1, newElement)

5）数组整体修改，可以触发视图更新

var tempArray = this.array; 
tempArray[0].show = true; 
this.array = tempArray

6）用Object.assign或lodash.assign可以为对象添加响应式属性，可以触发视图更新

  //Object.assign的单层的覆盖前面的属性，不会递归的合并属性
  this.obj = Object.assign({},this.obj,{a:1, b:2}) 
  //assign与Object.assign一样
  this.obj = _.assign({},this.obj,{a:1, b:2}) 
  //merge会递归的合并属性 
  this.obj = _.merge({},this.obj,{a:1, b:2})

7） Vue包含一组观察数组变异的方法，使用它们改变数组也会触发视图更新不变异的方法:

  push()		向数组的末尾添加一个或多个元素，并返回新的长度。
  pop()			删除最后一个元素，把数组长度减 1，并且返回它删除的元素的值。 
  shift() 		把数组的第一个元素从其中删除，并返回第一个元素的值。
  unshift()		向数组的开头添加一个或更多元素，并返回新的长度。 
  splice() 		向/从数组中添加/删除项目，然后返回被删除的项目。 该方法会改变原始数组。 
  sort()		对数组的元素进行排序。
  reverse() 	颠倒数组中元素的顺序。

不变异的方法：

filter() 
concat() 
slice() 
他们返回的是一个新数组，使用这些方法时，可以用新数组来替换原始数组

原理:

– Vue 在检测到数组变化时，并不是直接重新渲染整个列表，而是最大化复用DOM元素。替换的数组
中，含有相同元素的项不会被重新渲染，
因此可以大胆的用新数组来替换旧数组，不用担心性能问题。

值得注意的是:

以下变动的数组中Vue是不能检测到的，也不会触发视图更新。
1.通过索引直接设置项， 比如this.books[3]={…}
2.修改数组长度， 比如 this.books.length = 1;
两个问题都可以用splice来解决：
第一个问题 还可以用 set方法 this.$set(this.books,3,{…})