构件可以具有逻辑/计算值

May an ember component have logic / computed values

本文关键字:计算 构件      更新时间:2023-09-26

我使用的是最新版本的ember(1.13.5),但想要兼容ember 2.0。

我想创建一个组件,它有一个输入参数和一些内部逻辑来计算另外两个值,这样组件模板就有3个绑定到变量的字段。

如果这是一个普通的模板,它将很好地与控制器一起工作。但是组件没有控制器。烬有什么可能。组件子类?

'templates'components'my-component.hbs中定义的组件:

<h1>{{value1}}<h1>
<h2>{{value2}}<h2>
<h3>{{value3}}<h3>

用于模板:

{{my-component value1=34}}

然后在某处用javascript定义value2和value3

value2 = value1 *3;
value3 = value2 *6;

在哪里把这个javascript所以value2和value3在我的组件可用?(这只是一个简单的例子。value2和value3的实际逻辑更为复杂,但仅基于value1)

当然可以,你可以把它放在一个已定义的组件类中。

很可能你的组件真的是'templates'components'my-component.hbs而不是'templates'components'my-component.js。您需要做的是为您的组件'components'my-component.js定义一个类

如果您正在使用Ember-cli并且使用了scaffolding,那么它可能已经存在,然后您将在其中放置计算属性以完成value2和value3。

如果不是,它看起来就像这样(除非你使用全局变量)。

import Ember from "ember";
export default Ember.Component.extend({
  value2: Ember.computed('value1', function() {
    //....
  })
});