Vue中重置data的資料為初始狀態

2021-10-05 15:00:18 字數 982 閱讀 6622

例如data中的資料如下

data()


}}
你想在某個方法中重置data中的form物件，一般這樣操作

this


.form.name =


' 'this


.form.***=


' 'this


.form.desc=


' '
或者

this


.form=
如果form裡的屬性有很多呢，這樣操作是不是非常的麻煩，看上去也不美觀呀，那你可以使用下面的方法，一行**搞定

this.$data獲取當前狀態下的data

this.$options.data()獲取該元件初始狀態下的data

所以，下面就可以將初始狀態的data複製到當前狀態的data，實現重置效果：

object.


assign


(this


.$data,


this


.$options.


data()


)
當然，如果你只想重置data中的某乙個物件或者屬性：

this


.form =


this


.$options.


data()


.form
也可以通過給元件 $data 物件賦值來重置來重置整個 $data

this


.$data =


this


.$options.


data


()
結語

vue元件可以通過this.$options物件獲取你編寫的任何方法，比如 created( ) 生命週期函式，發現vue新玩法

vue系列 重置data中的值

我們提交完表單之後想要重置表單的資料，但是乙個乙個賦值又很麻煩，所以有了下面的方案。元件當前data物件 this data 元件初始化狀態下的data物件 this options.data 重置data物件到初始化狀態 object.assign this data,this options.d...

Vue 元件中的data資料

1.元件可以有自己的 data 資料 2.元件的 data 和 例項的 data 有點不一樣,例項中的 data 可以為乙個物件,但是 元件中的 data 必須是乙個方法 3.元件中的 data 除了必須為乙個方法之外,這個方法內部,還必須返回乙個物件才行 4.元件中 的data 資料,使用方式,和...

更新vue的data中的元素，vue更新錯誤

解決方式 用 深拷貝 可以解決，直接對vue操作的 一級資料進行深拷貝 然後修改 錯誤方式 如果這樣更新 vue看到的資料位址根本沒有改變 this.blog entries logs index open detail this.blog entries logs index open detai...