vue -- 數組變化檢測

vue有時候在改變了數組的值的時候，視圖並不會更新，這時候就需要調用vue變化數組的方法來實現

一、變化數組方法

push()
pop()
shift()
unshift()
splice()
sort()
reverse()

二、替換一個數組

filter()
concat()
slice()

為什么vue數組改變了，視圖不變？
Tips
由於 JavaScript 的限制，Vue 無法檢測到以下數組變動
1、當你使用索引直接設置一項時，例如 vm.items[indexOfItem] = newValue
2、當你修改數組長度時，例如 vm.items.length = newLength

data: {
    arr: [
        {name: '李狗蛋'},
        {name: '李翠花'}
      ]
}
app.arr[0] = {name: '王二丫'}

展示結果：

現在我們再來改變一下：
```js
Vue.set(app.arr,0,{name: '王二丫'})

展示結果:
李狗蛋
李翠花

發現雖然修改了arr第一項的內容，但是視圖並沒有像我們所預想的那樣跟着改變
#### 如何解決單獨改變數組某項值而視圖不刷新問題？
### 1、Vue.set()
Vue.set(目標數組,改變項的索引,新值)
```js
王二丫
李翠花

或者利用數組方法splice的替換功能

app.arr.splice(0,1,{name: '丫蛋'})

展示結果：

丫蛋
李翠花

如何解決設置數組長度而視圖不刷新問題？

2、splice()

app.arr.splice(1)

展示結果 :

李狗蛋

splice()會刪除指定索引及以后的數組項，返回的是為指定索引之前的數組項組成的新數組