Question

我有一个属性mood，它是组件接口的一部分。在幕后我有一个名为_mood的计算属性：

const { computed, typeOf } = Ember;
_mood: computed('mood','A','B','C' function() {
  let mood = this.get('mood');
  if (typeOf(mood) === 'function') {
    mood = mood(this);
  }
  return !mood || mood === 'default' ? '' : `mood-${mood}`;
}).volatile(),

我的情况是，volatile()依旧是Ember的计算对象成功解析了所有非DOM单元测试但由于某种原因它没有触发模板以在任何情况下更新DOM。如果被监视的任何属性发生更改（在这种情况下为['mood','A', 'B', 'C']）更改，它至少应该更新。因为它是易变的（也就是说，不会缓存结果）如果模板知道重新渲染组件但是由于某种原因它不会导致新的结果显示在模板中。

如果我删除了volatile()标记，它对于静态/标量值工作正常，但如果情绪是一个函数，那么结果会被缓存，因此它只能工作一次（不是这个问题的工作解决方案）。

我如何充分利用这两个世界？

Answer 1

我仍然不确定为什么volatile()方法会关闭模板更新。这个可能是一个真正的错误，但就解决我的问题而言，重要的是要认识到 volatile 方法绝不是最好的方法。

相反，重要的是确保当mood作为函数进入时，函数的依赖项包含在CP的依赖项中。因此，例如，如果mood传递了以下函数：

mood: function(context) {
   return context.title === 'Monkeys' ? 'happy' : 'sad'; 
}

要使此函数有效评估 - 更重要的是在正确的时间触发重新评估 - title属性必须是计算属性的一部分。希望这是为什么直截了当，但这里我认为我可能会接受这个：

_moodDependencies: ['title','subHeading','style'], _mood: computed('mood','size','_moodDependencies', function() { let mood = this.get('mood'); console.log('mood is: %o', mood); if (typeOf(mood) === 'function') { run( ()=> { mood = mood(this); }); } return !mood || mood === 'default' ? '' : `mood-${mood}`; }),

这样更好，因为它允许在构建时为每个组件定义一组静态属性（_mood CP对我来说是一些组件使用的mixin的一部分）。不幸的是，这还没有完全发挥作用，因为它显然没有解包/解构_moodDependencies。

我会对此进行排序并更新，除非有其他人打败我。

Ember的易失性和模板

1 个答案: