vue 數據改變 視圖沒有刷新

最近在用Vue作項目的時候，常常遇到一個問題，當數據改變以後，視圖卻沒有刷新，下面我就總結一下我在開發過程當中遇到的幾種視圖沒法刷新的狀況，不必定全面~！爲了方便演示，咱們來建立一個最最簡單的demo。

//html
<div id="test"></div>

//js
var app = new Vue({
     el:'#test',
     data:{
          msg:"Vue大法好！"
     }
});

1、直接用索引值改變數組的某個值，或者直接改變數組的長度

問題描述：有關於數組的改變而引起的視圖刷新應該是最多見的問題了，在Vue官方文檔中提到， 因爲 JavaScript 的限制， 當你利用索引直接設置一個項，或者直接改變數組的長度時，Vue將不會檢測到數據的變化。

像上圖的兩種寫法，將沒法刷新視圖，只有使用文檔中列出來的數組方法，才能實現數據的改變，包括push()、pop()、shift()、unshift()、splice()、reverse()、sort()。其實這些列出來的數組的方都是能改變原數組的，因此可以被watcher監測到，從而引起視圖的從新渲染，原理相同，這邊就不一一的測試啦~列出下面一個做爲參考:

那麼若是隻想要改變數組中某一個數據的值，可使用的方法有兩種：
一、使用splice()方法，刪除並替換原數組中的值
二、使用Vue提供的set方法