亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

vue數(shù)據(jù)雙向綁定的注意點(diǎn)

 更新時(shí)間:2017年06月23日 11:47:13   作者:窩代碼  
這篇文章主要為大家詳細(xì)介紹了vue數(shù)據(jù)雙向綁定的注意點(diǎn),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下

最近一個(gè)vue和element的項(xiàng)目中遇到了一個(gè)問(wèn)題: 動(dòng)態(tài)生成的對(duì)象進(jìn)行雙向綁定是失敗

直接貼代碼:

 <el-form :model="addClass" :rules="rules" ref="addClass">
   <el-form-item label="表單分類名稱" prop="NAME" :label-width="formLabelWidth">
      <el-input v-model="addClass.NAME" auto-complete="off"></el-input>
   </el-form-item>
   <el-form-item label="表單分類描述" prop="DESCRIBE" :label-width="formLabelWidth">
      <el-input type="textarea" autosize row=5 v-model="addClass.DESCRIBE" auto-complete="off"></el-input>
   </el-form-item>
 </el-form>

上面一個(gè)簡(jiǎn)單的element的表單;addClass就是我要將數(shù)據(jù)綁定到的對(duì)象;他初始是一個(gè)空對(duì)象;我需要在其他地方讀取然后給他添加屬性,同時(shí)給表單進(jìn)行綁定。

在這個(gè)過(guò)程中就發(fā)現(xiàn),雙向綁定失敗了 , 而且也沒(méi)有報(bào)錯(cuò)。

我是通過(guò)obj.xxx = xxx;這種方法進(jìn)行綁定; 經(jīng)過(guò)測(cè)試發(fā)現(xiàn)雙向綁定并沒(méi)有實(shí)現(xiàn)。

解決方法:

參照 VUE官方文檔: https://cn.vuejs.org/v2/guide/reactivity.html ;

受現(xiàn)代 JavaScript 的限制(以及廢棄 Object.observe),Vue 不能檢測(cè)到對(duì)象屬性的添加或刪除。由于 Vue 會(huì)在初始化實(shí)例時(shí)對(duì)屬性執(zhí)行 getter/setter 轉(zhuǎn)化過(guò)程,所以屬性必須在 data 對(duì)象上存在才能讓 Vue 轉(zhuǎn)換它,這樣才能讓它是響應(yīng)的。例如:

var vm = new Vue({
 data:{
 a:1
 }
})
// `vm.a` 是響應(yīng)的
vm.b = 2
// `vm.b` 是非響應(yīng)的

Vue 不允許在已經(jīng)創(chuàng)建的實(shí)例上動(dòng)態(tài)添加新的根級(jí)響應(yīng)式屬性(root-level reactive property)。然而它可以使用 Vue.set(object, key, value) 方法將響應(yīng)屬性添加到嵌套的對(duì)象上:

Vue.set(vm.someObject, 'b', 2)

以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論