Vue 陣列和物件更新後頁面 DOM 二

2021-08-21 17:58:24 字數 694 閱讀 9551

上篇文章vue 陣列和物件更新後頁面 dom 不更新問題的解決方法。能夠解決很多頁面資料響應的問題,但是最近在專案中發現在某些情況下上篇文章的解決方式並不是針對任何問題的。

假設資料結構是下面的情況:

polist:,]},

...}

現在需要在某個方法中修改 修改itemlist陣列中index為 1 的物件的a屬性 。

使用上篇講到的方法:

}

this.$set(this.polist

.list

.itemlist[1],'a',3)

發現頁面中並沒有發生變化,官網上面的解決方法在這種情況下並沒有生效。

在這個問題上糾結了很久,試了又試,終於發現了問題所在,這種結構太深的資料結構,vue並不會一直監視下去,所以資料結構不要超過3層。

所以要想實現上面的效果,需要想辦法減少資料的層級,如果確實需要複雜的資料結構,可以在data中定義乙個list, 然後頁面上繫結list中的值。

data()

}methods:

}

vue更新陣列和物件

vue更新陣列和物件 陣列更新檢測 更改陣列物件 let items this.formvalidate.items items.map item,index item,this.set this.formvalidate.items,index,item 複製 問題彙總 修改hosts c win...

Vue 陣列和物件更新,但是頁面沒有重新整理

在使用陣列的時候,陣列內部資料發生改變,但是與陣列繫結的頁面的資料卻沒有發生變化。data obj methods console.log this.todos this.set this.todos,0,nn this.forceupdate 這種修改得方式,無法出發陣列得set,導致頁面得資料不...

vue 為什麼陣列或物件資料改變後頁面資料不更新

vue的 set屬性 vue在進行初始化例項時進行資料雙向繫結,使用object.defineproperty 對屬性遍歷新增 getter setter 方法,所以屬性必須在 data 物件上存在時才能進行上述過程!vue初始化例項後,再去給例項物件新增屬性時並沒有新增getter和setter的...