Vue中data重置問題

Object.assign()

Object.assign（）方法用於將所有可枚舉屬性的值從一個或多個源對象復制到目標對象。它將返回目標對象。

目標對象有1個，后邊可以有多個源對象。注意他只會拷貝源對象自身且是可枚舉的屬性到目標對象。該方法使用源對象的[[Get]]和目標對象的[[Set]]，所以它會調用相關 getter 和 setter。

復制對象

var obj = { a: 1 };
var copy = Object.assign({}, obj);
console.log(copy); // { a: 1 }

 注意，Object.assign()是淺拷貝。

合並對象

var o1 = { a: 1 };

 var o2 = { b: 2 };

 var o3 = { c: 3 }; 

var obj = Object.assign(o1, o2, o3); 

console.log(obj); // { a: 1, b: 2, c: 3 } 

console.log(o1); // { a: 1, b: 2, c: 3 }, 注意目標對象自身也會改變。

 注意，具有相同屬性的對象，同名屬性，后邊的會覆蓋前邊的。

Vue中的使用技巧

由於Object.assign()有上述特性，所以我們在Vue中可以這樣使用：
Vue組件可能會有這樣的需求：在某種情況下，需要重置Vue組件的data數據。此時，我們可以通過this.$data獲取當前狀態下的data，通過this.$options.data()獲取該組件初始狀態下的data。
然后只要使用Object.assign(this.$data, this.$options.data())就可以將當前狀態的data重置為初始狀態。