我正在尝试从Eember 2迁移到Eember 3，并且我遇到了计算属性的问题。
以前，我在一个组件中有这样的计算属性：
import Ember from 'ember';
totalPrice: Ember.computed('attr1', 'attr2', function() {
return this.attr1 + this.attr2;
})
我可以在hbs模板中做类似的事情：
Total : {{totalPrice}}
在新版本的余烬，我有这个：
import { computed, set } from '@ember/object';
totalPrice: computed('attr1', 'attr2', function() {
return this.attr1 + this.attr2;
})
但是在模板中，总价格属性显示为[object]而不是值。我错过了什么吗？
我认为您需要使用函数而不是箭头函数，因为使用箭头函数，this会丢失。
使用com的函数保持this引用组件实例。
computed('attr1', 'attr2', function() {
return this.attr1 && this.attr2;
})
这是一个专门针对enpe-cli3.4的片段
import Controller from '@ember/controller';
import { computed } from '@ember/object';
export default Controller.extend({
appName: 'Ember sdfa',
attr1: 1,
attr2: 2,
attr3: 'foo',
attr4: 'bar',
attr5: 3,
attr6: 4,
totalPrice: computed('attr1', 'attr2',function() {
let a = this.attr1 ? this.attr1 : 0;
let b = this.attr2 ? this.attr2 : 0;
let total = a + b;
return total;
}),
});
这应该适用于获取总价格，这是你可以在https://ember-twiddle.com/8801e28a888b469b8057d67a63829808?openFiles=controllers.application.js玩的余烬旋转，
如果要把线连在一起应该是这样的
fooBar: computed('attr3', 'attr4', function() {
let foo = this.attr3 ? this.attr3 : null;
let bar = this.attr4 ? this.attr4 : null;
return `${foo} ${bar}`
}),
输出将是foo bar
如果您想组合一个数字，请按照下面的操作
combinedNumber: computed('attr5', 'attr6', function() {
let a = this.attr5 ? this.attr5 : null;
let b = this.attr6 ? this.attr6 : null;
return `${a} ${b}`
}),
compineNumber的输出是3 4
希望有帮助。
下面的代码应该可以正常工作。
如果attr1和attr2是文本。
import { computed } from '@ember/object';
...
totalPrice: computed('attr1', 'attr2', function() {
return `${this.attr1} ${this.attr2}`;
})
attr1和attr2是数字。
attr1: 1,
attr2: 2,
totalPrice: computed('attr1', 'attr2', function () {
return this.attr1 + this.attr2;
//(or)
return `${this.attr1 + this.attr2}`;
}),
