如何创建一个 Ember 计算 属性 将 属性 加 1？

Question

我刚刚学习 Ember，我对计算属性有点困惑。指南中的所有内容都使用字符串，例如计算 属性 ，它根据名字和姓氏创建全名等。无论如何，我对如何使用整数感到困惑，因为它似乎语法几乎要求字符串的使用。

例如，我的控制器上有一个名为 count 的 属性。

import Ember from 'ember';

export default Ember.Controller.extend({
  count: 0,

  counter: Ember.computed('count', function() {
    var num = `${this.get('count')}`;
    var newNum = parseInt(num) + 1;
    this.set('count', newNum);
    return this.get('count');
  })
});

我知道这段代码真的很糟糕，我只是想说明我正在尝试做的事情和失败的事情。为什么Ember.computed第一个参数是字符串？

当我使用整数而不是字符串时，为什么我必须在 this.get 和 this.set 中使用字符串？我必须手动解析 int 否则它 returns 一个字符串，为什么它将我的计数 属性 转换成一个字符串？

反正我在ember检查器的时候运行

$E.get('count')

确实加1成功了，但是没有继续加1，所以我觉得不是更新实际的count 属性.

非常感谢。感谢您的帮助。

Answer 1

我根据你的代码设置了一个Ember Twiddle。我会尽力解答您的每一个问题：

您可以将 Ember.Object 视为 {} 的包装器。所有 Ember.Object 键都是字符串，因为 {} keys are strings in Javascript.

对于存储在 Ember.Object 上的每个 属性，属性 是一个以某个字符串作为键的值。要查找该值，您必须提供该值的 "path" 或 "location"，由键给出（就像散列 table）。这就是为什么你需要在 get 和 set.

中指定一个字符串

值可以是 Javascript 中的任何类型，而不仅仅是字符串。看看我发布的 Ember Twiddle，然后打开你的控制台。在您的代码中，num 是一个字符串，因为您已将其包装在 ES6 模板字符串中，该字符串正在转换 this.get('count').

的值

---

Ember.computed 旨在将数据呈现到模板中。重要的是要了解：

• 懒惰
• 它缓存计算结果。
• A Computed 属性 将 仅 在其依赖的一个或多个属性发生变化时重新计算。

调用Ember.computed时，首先传入任意数量的字符串。每个字符串都是您的 CP "depends" 所在的值（在 Ember.Object 上）的路径。

因为 CP 是惰性的，'counter' 只会在您在代码或模板中访问它时计算。如果 'count' 发生变化，'counter' 的缓存值将被遗忘。 下次'counter'被访问，它将重新计算。

在这种情况下，'counter' CP 函数只运行一次，因为'count' 永远不会改变。这就是为什么你只观察到一个加法。