vue.js - 跟踪 vue.js 中外部变量的计算属性未更新

Question

我有一个计算属性 - playerId，它引用了一个没有更新的外部对象。

例如:

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

如果我在点击事件中运行此调用，它会输出正确的 ID。但是，当它更新时 - 自行计算不会更新。我如何让它工作？还是我做错了？

Answer 1

Vue.js 中的计算属性不会对没有任何反应依赖性的数据产生 react 。例如，下面的代码将不会每次都更新，因为Date.now() 没有反应依赖。这个计算值的结果被缓存，它总是返回与第一次返回的值相同的值。

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

然后，您可能想知道如何使您的外部对象具有反应性。关键是，您最好将对象放入 data 部分，以便使用 Vue 的内部观察器跟踪它的变化。如果您的计算属性甚至有一个响应式依赖项，例如引用 data 或调用 method，它会在每次更新依赖项并且从计算属性返回的内容正在运行时收到通知也要更新。

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