問(wèn)題:通過(guò)表單獲取表格的某一行的數(shù)據(jù)蕉朵,修改數(shù)據(jù)的時(shí)候表格的數(shù)據(jù)也會(huì)跟著表單的數(shù)據(jù)變化,即使你取消表格數(shù)據(jù)還是變化了阳掐。
handleEdit(row) {
this.form = row
}
但是我表單數(shù)據(jù)和表格數(shù)據(jù)不是同一個(gè)對(duì)象始衅,而且輸入框通過(guò)v-model取值,表格通過(guò)prop傳值也是固定寫(xiě)法缭保,也沒(méi)有寫(xiě)事件調(diào)接口等汛闸。
原來(lái)整個(gè)表格數(shù)據(jù)是一個(gè)數(shù)組,數(shù)組的每一行是一個(gè)對(duì)象艺骂,row是Object對(duì)象诸老,直接賦值是淺拷貝,復(fù)制的就是它的地址钳恕。
這涉及到Javascript數(shù)據(jù)類(lèi)型的知識(shí)别伏,Javascript有兩種數(shù)據(jù)類(lèi)型,基本類(lèi)型是存放在棧內(nèi)存里的忧额,值不可變厘肮,基本類(lèi)型的比較是它們的值的比較。引用類(lèi)型的值是保存在堆內(nèi)存中的對(duì)象宙址,按照引用訪(fǎng)問(wèn)轴脐,值是可變的,引用類(lèi)型的比較是引用的比較。
因此大咱,想要進(jìn)行深拷貝我們可以使用操作JSON的方法來(lái)解決引用問(wèn)題恬涧。
this.form = JSON.parse(JSON.stringify(row))