Vue對象賦值視圖不更新問題及解決方法
當(dāng)我們需要對vue里面data數(shù)據(jù)做動態(tài)更新。
如下,實例化了Vue對象,其下vueData為data屬性指向,現(xiàn)在我們需要由后臺裝載完整的data對象
現(xiàn)在我們需要裝載更新完整的data對象,常規(guī)的賦值方式并不會引起視圖的更新,雙向綁定會失效。
如上圖中默認broker_list為空對象,裝載完之后broker_list 包含新項(ZY98)
解決辦法:
$.each(clientData, function (k, v) { Vue.set(vueData,k,Object.assign({}, v)); });
clientData 為外部初始化的數(shù)據(jù)。
Object.assign({}, v)
克隆一個新對象賦值給vueData中相關(guān)項,設(shè)置完后依然會更新視圖,保證雙向綁定有效。
總結(jié)
以上所述是小編給大家介紹的Vue對象賦值視圖不更新問題及解決方法,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章
vue-router 按需加載 component: () => import() 報錯的解決
這篇文章主要介紹了vue-router 按需加載 component: () => import() 報錯的解決,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-09-09vue不用import直接調(diào)用實現(xiàn)接口api文件封裝
這篇文章主要為大家介紹了vue不用import直接調(diào)用實現(xiàn)接口api文件封裝,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2022-06-06一文掌握Pinia使用及數(shù)據(jù)持久化存儲超詳細教程
這篇文章主要介紹了Pinia安裝使用及數(shù)據(jù)持久化存儲的超詳細教程,本文通過實例代碼給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2023-07-07Vue項目中使用WebUploader實現(xiàn)文件上傳的方法
WebUploader是由 Baidu WebFE(FEX) 團隊開發(fā)的一個簡單的以 HTML5為主 , FLASH為輔 的現(xiàn)代 文件上傳組件 。這篇文章主要介紹了在Vue項目中使用WebUploader實現(xiàn)文件上傳,需要的朋友可以參考下2019-07-07Vue 樣式切換及三元判斷樣式關(guān)聯(lián)操作
這篇文章主要介紹了Vue 樣式切換及三元判斷樣式關(guān)聯(lián)操作,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08Vue數(shù)據(jù)驅(qū)動表單渲染,輕松搞定form表單
這篇文章主要介紹了Vue數(shù)據(jù)驅(qū)動表單渲染,輕松搞定form表單,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-07-07