當前遇到的問題是：

當我們改變data中數組里面是某一個元素，視圖不進行更新

帶著解決這個問題，我們首先來到了vue官方文檔：

當使用上面的方法對數組進行操作的時候，就會觸發視圖更新

但是現在問題假如我們并不是用這些方法對數組進行操作
例如：

data(){return{arr:[1,2,3]}}...this.arr[0] = 10

那么我們就要深入vue的響應式原理了

當我們在data選項中添加一些對象時
2

我們可以觀察到 vue 將對象里的每個屬性添加了Getter 和 Setter，

那么接下來就進入解決標題問題的環節了：

當我們直接通過索引改變數組里面的元素時，此時Vue是檢測不到的，
所以我們可以通過

Vue.set(vm.items, indexOfItem, newValue)

也可以使用

vm.$set(vm.items, indexOfItem, newValue)

上面兩種作用其實是一樣的，但是這種強制添加進去并不推薦，會降低性能。
所以在這里我們推薦下面一種：

vm.items.splice(newLength)

剛剛上面有說到利用splice對數組進行操作，vue是可以檢測到的！！

上面聊的都是比較簡單的情況，當我們遇到多重嵌套的時候，我們可以試一試下面這個方法：

this.$forceUpdate()會更新視圖和數據，觸發updated生命周期

總結

以上是生活随笔為你收集整理的vue检测不到data里数组里面元素的变化的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。