Vue指令（二）--数组的变动

1、数组更新数据，引起视图更新

数据驱动：数据发生变化，引起视图的变化

Vue在检测数组变化的时候，并不是直接重新渲染整个列表，而是最大化的复用Dom元素。

替换的数组中，含有相同元素的项是不会被重新渲染，所以，新数组替换旧数组是，不用担心性能问题。

数组函数：

改变原数组

push()

pop()

shift()

unshift()

splice()

sort()

reverse()

产生新数组，替换原数组

filter()           

concat()

slice()

以下两种情况下，Vue不能检测到：

1.直接索引赋值：  app.books[3] = {...}  =>Vue.set(app.books,3,{...})  或  this.$set(app.books,3,{...})

2.修改数组长度： app.books.length=1  => app.books.splice(1);

2、使用计算属性，使用数组的副本进行数据操作，不改变数组本身

 computed: {
       filterBooks: function () {
           return this.books.filter(function (item) {
               return item.name.match(/Javascript/);
           })
       }
  }