2017-09-20 45 views
2

我有一個計算屬性 - playerId引用了一個未更新的外部對象。在vue.js中跟蹤外部變量的計算屬性不更新

例如:

var player = require('players'); 
computed: { 
    playerId: function() { 
     return player.id 
    } 
} 

如果我在點擊事件上運行此調用它輸出正確的ID。但是,當這個更新 - 自己計算不會更新。我如何得到這個工作?或者我錯誤地回答這個問題?

+0

創建數據屬性的對象,並從計算性能 – divine

+0

@divine返回的對象。如果我做到這一點 - 我如何獲得更新的觀點?我是否需要手動調用某些東西來渲染新值或者是否應該自動更新視圖? – KingKongFrog

+0

您必須在點擊時調用計算屬性 – divine

回答

2

Vue.js中的計算屬性不會與沒有任何反應性依賴性的數據發生反應。例如,下面的代碼將在每次更新而不是,因爲Date.now()沒有反應依賴性。此計算值的結果得到緩存,並始終返回與第一次返回的值相同的值。

computed: { 
    now: function() { 
    return Date.now() 
    } 
} 

然後,你可能想知道如何讓你的外部對象被動。關鍵是,你最好把你的對象放入data部分,以便用Vue的內部觀察器跟蹤它的變化。如果您的計算屬性甚至有一個被動依賴項(如data或調用method),則每次更新依賴項時都會通知它,並且計算屬性返回的內容也將被更新。

https://vuejs.org/v2/guide/computed.html