Vue中使用$set方法來更新數(shù)組，這個方法會使vue監(jiān)聽到數(shù)組的變更并及時將頁面更新，因為vue默認不會用Observer追蹤數(shù)組的變化。下面將介紹如何使用$set方法更新數(shù)組。

let app=new Vue({
el:"#app",
data:{
arr:["a","b","c"],
},
methods:{
addNewItem(){
this.arr.push("d");
},
updateArray(index,value){
this.$set(this.arr,index,value);
}
}
});

如上面代碼所示，在data屬性中定義了一個數(shù)組arr，并創(chuàng)建兩個方法：addNewItem和updateArray。addNewItem方法用于向數(shù)組arr中添加新的項，updateArray方法用于更新數(shù)組arr中下標為index的元素的值，$set方法就是在updateArray方法中調(diào)用的。

下面我們來測試一下updateArray方法，通過調(diào)用這個方法，我們將數(shù)組arr中下標為1的元素的值從“b”變成了“e”:

app.updateArray(1,"e");
console.log(app.arr);

上述代碼中，我們首先調(diào)用了app的updateArray方法，并傳入了兩個參數(shù)：1和“e”，即要更新的元素的下標和要更新成的值。隨后我們再通過console.log方法來輸出改變后的數(shù)組arr中的值，結(jié)果如下所示：

["a","e","c"]

可以看到，數(shù)組arr中下標為1的元素的值被成功地更改了。如果不使用$set方法，而直接使用Vue.js的屬性更新方式，例如：

this.arr[index] = value;

雖然這個賦值操作會修改數(shù)組arr的值，但Vue.js依舊不會觸發(fā)UI界面的更新，因為該方法不能通知vue監(jiān)聽器刷新視圖。所以，我們需要使用Vue提供的$set方法來更新數(shù)組arr中的值才能得到正確的結(jié)果。

綜上所述，我們應(yīng)該在Vue.js中使用$set方法來更新數(shù)組中的元素，否則Vue.js監(jiān)聽器將不會捕捉到數(shù)組元素的變化，導(dǎo)致無法及時更新UI界面。使用$set方法的方法應(yīng)該包含以下三個參數(shù):

• 要更新的數(shù)組
• 要更新元素的下標位置
• 要更新成的新值