如何创建一个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或者它返回一个字符串,为什么它将我的count属性转换为字符串？

无论如何,在我跑步时的灰烬检查员

$E.get('count')

它确实成功添加1,但无法继续添加1,这使我认为它不会更新实际count属性.

非常感谢.我很感激帮助.

Answer 1

我根据你的代码设置了一个Ember Twiddle.我会尝试解决你的每个问题:

你可以把它想象Ember.Object成一个包装器{}.所有Ember.Object键都是字符串,因为{} 键是Javascript中的字符串.

对于存储在Ember.Objecta 上的每个属性,该属性是一个以String为键的值.要查找该值,您必须提供值的"路径"或"位置",如密钥所给出的(就像哈希表一样).这就是你需要在get和中指定一个字符串的原因set.

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

Ember.computed旨在将数据呈现到模板中.了解这一点很重要:

• 这很懒惰
• 它缓存计算结果.
• 计算属性仅在其依赖的一个或多个属性发生更改时才会重新计算.

当你打电话时Ember.computed,你首先传入任意数量的字符串.每个字符串都是Ember.ObjectCP"依赖" 的值(在a上)的路径.

由于CP是惰性的,'counter'因此只有在代码或模板中访问它时才会计算.如果'count'要改变,缓存的值'counter'将被遗忘.在接下来的时间'counter'被访问,它会重新计算.

在这种情况下,'counter'CP函数只运行一次,因为'count'从不更改.这就是为什么你只观察一个添加.