Question

我正在为侧边栏构建一个异步组件，列出您可能知道的人，一个API的结果集。

以下代码用于将这些项目添加到页面，因为它们可供商店使用。当用户注销时，我会调用unloadAll()，但是，我的recommendations计算属性为volatile()，因此它不会被缓存，并会填充下一个用户（或相同）的新条目登录到应用程序实例。

// app/services/invite.js

recommendations: Ember.computed(function() {
  return this.get('store').findAll('recommendation');
}).volatile(),

// app/templates/components/people-you-may-know.hbs

{{#each invite.recommendations as |person|}}
  {{...}}
{{/each}}

// app/components/people-you-may-know.js

export default Ember.Component.extend({
  invite: Ember.inject.service()
})

我想我需要一个像下面这样的新计算属性，但这是我在空白页面和无限循环中挣扎的地方。

reducedRecommendations: Ember.computed('recommendations', function()
  return this.get("recommendations").slice(0, 10);
}),

{{#each invite.reducedRecommendations as |person|}}
  {{...}}
{{/each}}

Answer 1

this.get('store').findAll('recommendation')

这将返回实时数组，这意味着无论何时使用新值更新商店，它都会自动更新。所以它总是与商店同步。在这种情况下，您不需要volatile计算属性。

recommendations: Ember.computed(function() {
  return this.get('store').findAll('recommendation');
}).volatile(),

reducedRecommendations: Ember.computed('recommendations', function()
  return this.get("recommendations").slice(0, 10);
}),

在上面的代码中，reducedRecommendations - 由于这是请求recommendations并且它正在更改recommendations属性，然后再次调用reducedRecommendations此无限循环将开始吧因为你强迫通过recommendations重新计算vloatile。如果您只是删除volatile并将依赖关键字更改为recommendations.[]将无缝工作。

recommendations: Ember.computed(function() {
      return this.get('store').findAll('recommendation');
    })

reducedRecommendations: Ember.computed('recommendations.[]', function()
  return this.get("recommendations").slice(0, 10);
}),

Answer 2

volatile与会话缓存无关。 volatile缓存意味着计算属性不会被缓存，您需要计算它。

所以我认为您不需要volatile而在recommendation CP中只需为当前用户执行逻辑并返回结果。

基于易失性计算属性在Handlebars模板中加载Promise

2 个答案: