Vue對象賦值視圖不更新問題及解決方法
更新時間：2019年06月03日 16:53:37 作者：max82645235
這篇文章主要介紹了Vue對象賦值視圖不更新問題及解決方法，本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值,需要的朋友可以參考下
當(dāng)我們需要對vue里面data數(shù)據(jù)做動態(tài)更新。
如下，實例化了Vue對象，其下vueData為data屬性指向，現(xiàn)在我們需要由后臺裝載完整的data對象
現(xiàn)在我們需要裝載更新完整的data對象，常規(guī)的賦值方式并不會引起視圖的更新，雙向綁定會失效。
如上圖中默認(rèn)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-09
vue不用import直接調(diào)用實現(xiàn)接口api文件封裝
這篇文章主要為大家介紹了vue不用import直接調(diào)用實現(xiàn)接口api文件封裝，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-06-06
一文掌握Pinia使用及數(shù)據(jù)持久化存儲超詳細(xì)教程
這篇文章主要介紹了Pinia安裝使用及數(shù)據(jù)持久化存儲的超詳細(xì)教程，本文通過實例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2023-07-07
Vue項目中使用WebUploader實現(xiàn)文件上傳的方法
WebUploader是由 Baidu WebFE(FEX) 團(tuán)隊開發(fā)的一個簡單的以 HTML5為主 ， FLASH為輔 的現(xiàn)代 文件上傳組件 。這篇文章主要介紹了在Vue項目中使用WebUploader實現(xiàn)文件上傳,需要的朋友可以參考下2019-07-07
這篇文章主要為大家詳細(xì)介紹了Vue.js實現(xiàn)簡單計時器應(yīng)用，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-09-09
這篇文章主要給大家介紹了關(guān)于Vue關(guān)閉當(dāng)前彈窗頁面的兩種方式,這是最近項目中遇到的一個需求,文中通過實例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-07-07
Vue 樣式切換及三元判斷樣式關(guān)聯(lián)操作
這篇文章主要介紹了Vue 樣式切換及三元判斷樣式關(guān)聯(lián)操作，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08
這篇文章主要介紹了編寫更好的v-for循環(huán)的6種技巧，幫助大家更好的理解和使用vue框架，感興趣的朋友可以了解下2020-12-12
Vue數(shù)據(jù)驅(qū)動表單渲染,輕松搞定form表單
這篇文章主要介紹了Vue數(shù)據(jù)驅(qū)動表單渲染,輕松搞定form表單,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-07-07
vue-devtools是一款基于chrome游覽器的插件，用于調(diào)試vue應(yīng)用，這可以極大地提高我們的調(diào)試效率，這篇文章主要介紹了vue-devtools的安裝與使用教程,需要的朋友可以參考下2023-03-03