如何创建向属性加 1 的 Ember 计算属性

How to create an Ember computed property that adds 1 to a property?

本文关键字：属性 Ember 计算 何创建 创建      更新时间：2023-09-26

我只是在学习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 属性。

非常感谢。我很感激你的帮助。

我根据

你的代码设置了一个Ember Twiddle。我将尝试解决您的每个问题：

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

对于存储在Ember.Object上的每个属性，该属性是一个以某个字符串作为键的值。要查找该值，您必须提供该值的"路径"或"位置"，如键所示（就像哈希表一样）。这就是为什么您需要在 get 和 set 中指定字符串的原因。

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

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

  • 很懒
  • 它缓存计算结果。
  • 仅当计算属性所依赖的一个或多个属性发生更改时，才会重新计算。

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

由于 CP 是惰性的，因此只有在代码或模板中访问 CP 时，才会计算'counter'。如果'count'更改，'counter'的缓存值将被遗忘。下次访问'counter'时，它将重新计算。

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

相关文章：