介绍
在 Ember.js 中，computed property 是一种十分常见的模式，用于根据模型中的属性计算出其他属性的值。但是，在一个大型的应用程序中，computed property 的代码量有可能会变得十分庞大，维护难度也会随之增加。
为了解决这种问题，开发者可以使用 ember-classy-computed 这个 npm 包，它是一个用于简化 Ember 计算属性的 mixin。
安装
首先需要确认你已经安装了 Ember.js 和 Node.js。接着，通过 Node.js 命令行工具运行以下命令：
npm install ember-classy-computed
之后，在你的 Ember.js 应用程序中，将 ember-classy-computed mix进你的组件或类中：
import Ember from 'ember';
import ClassyComputed from 'ember-classy-computed';
// example component
export default Ember.Component.extend(ClassyComputed, {
// ...
});基本用法
使用 ember-classy-computed 可以大大简化计算属性的代码。
-- -------------------- ---- ------- ------ ----- ---- -------- ------ -------------- ---- ------------------------ ------ ------- -------------------------------------- - -- --- ---------- -------- --------- -------- --------- -------------- ----------- ------- ----- -- --------- ---------- -- --- ---
上面的例子中，我们定义了一个组件，其中包含了三个属性：firstName、lastName 和 fullName。我们使用了 c 函数来创建一个名为 fullName 的计算属性，这个计算属性用传递的参数 firstName 和 lastName 拼接字符串生成一个字符串。
更多用法
除了基本用法之外，ember-classy-computed 还支持多种复杂用法。以下是一些示例：
使用 setter 和 getter
-- -------------------- ---- -------
------ ------- -------------------------------------- -
-- ---
------ --
-------- ---
----- -
------ ----------------- - --
--
-------- ------ -
----------------- ----- - ---
------ ------
--
---
-- ---
---参数化
export default Ember.Component.extend(ClassyComputed, {
// ...
fn: (num) => num * 2,
param: 5,
result: c('param', 'fn', (param, fn) => fn(param)),
// ...
});输入参数数量不定
export default Ember.Component.extend(ClassyComputed, {
// ...
values: [2, 5, 8],
result: c('values', function() {
return Ember.A(this.get('values')).reduce((a, b) => a + b, 0);
}),
// ...
});使用其他计算属性
-- -------------------- ---- -------
------ ------- -------------------------------------- -
-- ---
---------- --------
--------- --------
--------- -------------- ----------- ------- ----- -- --------- ----------
--------- ------------- ---------- -
----- ---- - ---------------------------- ------
------ ------- ----------
---
-- ---
---结论
到这里，你已经学习了 NPM 包 ember-classy-computed 的使用教程。使用 ember-classy-computed 可以大大简化计算属性的代码，同时增加代码的可读性和可维护性。希望这篇文章对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005526b81e8991b448cfede