Ember 中的 CSS 类是否需要多个计算属性？

Question

所以我有以下代码，它看起来像很多样板，而且我有一个更 ember 风格的解决方案。有没有办法在不为每个可能的状态计算属性的情况下做到这一点？

基本上我需要三个可能的 class 名称之一来更改页面上项目的颜色。因此，例如，假设我的销售电话是好还是好还是不太好，它会以不同的颜色显示。我从后端接收状态。这就是我正在做的。还有别的办法吗？

App.ReturnsEditController = Ember.ObjectController.extend({
  title: "Return Visit",
  titleSmall: "Create or edit your return visit here",
  isGood: (function() {
    return this.get('model').get('quality') === 'good';
  }).property('content.quality'),
  isOk: (function() {
    return this.get('model').get('quality') === 'okay';
  }).property('content.quality'),
  isGreat: (function() {
    return this.get('model').get('quality') === 'great';
  }).property('content.quality'),
});

Answer 1

可以使用Ember namespace methodEmber.computed.equal来减少代码量，像这样：

App.ReturnsEditController = Ember.ObjectController.extend({
  title: "Return Visit",
  titleSmall: "Create or edit your return visit here",
  isGood: Em.computed.equal('model.quality', 'good'),
  isOk: Em.computed.equal('model.quality', 'okay'),
  isGreat: Em.computed.equal('model.quality', 'great')
});

您还可以在您的应用中使用 Em 代替 Ember 和 CoffeeScript 以进一步减少代码量：

App.ReturnsEditController = Em.ObjectController.extend
  title: "Return Visit"
  titleSmall: "Create or edit your return visit here"
  isGood: Em.computed.equal 'model.quality', 'good'
  isOk: Em.computed.equal 'model.quality', 'okay'
  isGreat: Em.computed.equal 'model.quality', 'great'

另请注意，ObjectController 将来会被弃用。

Ember 中的 CSS 类是否需要多个计算属性？

Are multiple computed properties required for CSS classes in Ember?

javascript

properties

ember.js

Ember 中的 CSS 类 是否需要多个计算属性？

Are multiple computed properties required for CSS classes in Ember?

javascript

properties

ember.js

Ember 中的 CSS 类是否需要多个计算属性？