問題一
在某些情況下,需要重新使用data中的數據,但是data中的數據已經被各種表單、變量等賦值,那麼怎麼重置data的值呢?
解決方式:Object.assign()
JS相關函數
函數 | 含義 |
---|---|
Object.assign(target, …sources) | 將所有可枚舉屬性值從一個或多個源對象複製到目標對象 |
vue中相關函數
函數 | 含義 |
---|---|
this.$data | 當前狀態下的data |
this.$options.data() | 該組件初始狀態下的data |
所以,可以通過下面的方式重置當前頁面的data:
Object.assign(this.$data, this.$options.data.call(this));
或者,單獨重置data中的某一個對象或者屬性:
this.form = this.$options.data().form
問題二
用 this.$options.data() 重置組件data時,data() 裏用this獲取的props或methods都爲undefined
原因
new Vue的時候傳了一個對象,把該對象記爲options,Vue將options中自定義的屬性和Vue構造函數中定義的屬性合併爲vm.options.data()中的this指向vm.options下,所以this.methodA和this.B爲undefined。