Vue的對象屬性不與V-綁定改變：類

我有一個對象，一種看起來像這樣：Vue的對象屬性不與V-綁定改變：類

{ 
    data: [ 
     { 
      id: 28, 
      type: "blabla", 
      name: "myname", 
      language: "en", 
      active: true 
     }, 
     { 
      id: 5, 
      type: "blabla", 
      name: "myname2", 
      language: "fr", 
      active: false 
     }, 
     // etc 
    ] 
}

我已經達到分裂這個對象成我顯示這樣的羣體：

<li class="suggestion" v-for="suggestion in group"> 
    <a href="#" :class="{ active: suggestion.active }"></a> 
</li>

我想突出顯示我的結果，這就是爲什麼我的Vue對象上有一個position屬性。可以改變。

我有一個觀察者設立的位置屬性：

position() { 
    this.suggestions.forEach((suggestion, index) => { 
     suggestion.active = index === this.position; 
    }); 
}

它將使當前位置（所以目前項目活動）。當我檢查對象及其屬性的數組時，這工作正常。這些物品完美地改變了他們的.active屬性。但類綁定似乎沒有重新評估。

這裏怎麼回事？初始活動狀態確實被考慮在內，我的第一個項目被完美地突出顯示。

沒有發生什麼變化的實際類，雖然與Vue devtools我可以很好地看到對象的屬性正在改變。

來源

2017-05-31 Stephan-v

我猜VUE不會做了深刻的表。由於對象的屬性被改變而不是對象本身。 Vue不會重新渲染它。我想你必須設置一些觀察者。 – abhishekkannojia

@abhishekkannojia儘管在第一次運行中它似乎確實會遺漏財產，這很奇怪。 –

@ Stephan-v所以當你觀察那個觀察者的位置時，你會改變你的數據對象還是你的組數組？ – peaceman

所以問題是，如果對象被這樣創建：

object[suggestion.type].push(suggestion);

Vue公司不檢測更改到該對象。它與Vue如何監視對象進行更改有關。

爲了Vue公司與您共創對象發揮很好，並希望成爲反應你需要利用Vue.set

Vue.set(object, suggestion.type, suggestion)

或者

this.$set(object, suggestion.type, suggestion)

來源

2017-05-31 14:01:43 peaceman

Vue的對象屬性不與V-綁定改變：類

回答

相關問題