在Vue中,delete操作可以用來刪除對象或數組中的屬性。一般刪除一個對象的屬性可以使用delete obj[key]的形式,但是在使用Vue的時候,我們需要遵循其數據響應式的原則。也就是說,如果我們直接使用delete來刪除一個對象的屬性,不能夠觸發Vue所提供的響應式數據觀測。
由于Vue 2.x使用了ES5 Object.defineProperty(),所以Vue可以監聽對象的getter和setter,數據發生改變就會觸發響應式更新。如果我們使用delete來刪除對象的屬性,那么這個更新機制是不會被觸發的,所以我們需要使用Vue.set或Vue.delete。
Vue.delete用于刪除對象或數組中的屬性或元素,他的使用形式是Vue.delete(obj, key/index),其中obj可以為一個數組或對象,key可以為一個屬性名或者數組的下標。
//在數組中刪除元素 let arr = [1,2,3]; Vue.delete(arr, 1); console.log(arr);//輸出[1, 3] //刪除對象屬性 let obj = {name:'Tom',age:20}; Vue.delete(obj, 'name'); console.log(obj);//輸出{age: 20}
需要注意的是,Vue.delete方法會觸發響應式更新,但是如果你使用了Object.freeze()方法來阻止對一個對象的屬性進行改變,那么Vue.delete就不能刪除這個對象的屬性了。因為Object.freeze()會把對象凍結,但是這并不影響Vue的數據響應式更新,所以Vue.delete并不能夠操作被凍結的對象。