Ember DRY模式用于重用“Ember.computed.alias”

Ember DRY pattern for reusing "Ember.computed.alias"

本文关键字:Ember computed alias DRY 模式 用于      更新时间:2023-09-26

我有一个表单,它在多个视图之间转换。目前,每个controller.js文件都有一个很长的Ember.computed.alias列表。我如何将其分解成一个文件并将其导入每个控制器?

当前在每个controller.js

entityEmail: Ember.computed.alias('controllers.checkout.entityEmail'),
entityDOB: Ember.computed.alias('controllers.checkout.entityDOB'),
entityPhone: Ember.computed.alias('controllers.checkout.entityPhone'),
entityAddress1: Ember.computed.alias('controllers.checkout.entityAddress1'),
entityAddress2: Ember.computed.alias('controllers.checkout.entityAddress2'),
entityCity: Ember.computed.alias('controllers.checkout.entityCity'),

我想把所有这些都放到一个文件中这样我就可以在每个controller。js中导入一些1的行符

这是Ember.Mixin的经典用例。
你可以将所有这些计算出来的道具提取到一个mixin中,并扩展每个需要这些道具的控制器。

将下面的mixin添加到你的应用

// app/mixins/entity-form.js
import Ember from 'ember';
const { Mixin, inject, computed: { alias } } = Ember;
export default Mixin.create({
  checkout: inject.controller(),
  entityEmail: alias('checkout.entityEmail'),
  entityDOB: alias('checkout.entityDOB'),
  entityPhone: alias('checkout.entityPhone'),
  entityAddress1: alias('checkout.entityAddress1'),
  entityAddress2: alias('checkout.entityAddress2'),
  entityCity: alias('checkout.entityCity')
});

然后在控制器中使用

// app/controllers/example.js
import EntityFormMixin from 'yourAppName/mixins/entity-form';
const { Controller } = Ember;
export default Controller.extend(EntityFormMixin, {
  // rest of controller's props and functions
});

注意:安博。inject API从Ember 1.10.0开始可用。如果您使用的是旧版本,则需要将注入行替换为:needs: ['checkout'],并像在示例中那样使用"controllers."作为别名的前缀。