2015-08-15 94 views
4

我正在通過Aurelia教程,但故意只使用ES5和AMD/RequireJS,因爲最初我試圖減少我可能需要在我當前的生產應用程序中引入的技術超載(這是目前正在使用Angular,但我正在考慮交換到Aurelia而不是Angular 2),但我堅持讓計算屬性起作用。Aurelia計算屬性與ES5

我注意到一個update made in April刪除從允許以下語法的對象原型的計算功能,但我不知道我應該做的,而不是語法如下的內容:

Welcome.computed({ 
    fullName : function() { return this.firstName + " " + this.lastName; } 
}); 

我能做到與以下相同的效果,但看起來非常冗長,因爲取得了什麼成就!有沒有一個正確的Aurelia方式?

Object.defineProperty(
    Welcome.prototype, 
    "fullName", 
    { 
    get: function() { return this.firstName + " " + this.lastName }, 
    enumerable: true 
    }); 

回答

3

你在做什麼是正確─因爲寫這些額外的ES5代碼可能變得單調而乏味,你總是可以重新添加計算的工廠方法。

我還建議指定計算屬性的依賴關係來優化數據綁定效率。這下面的代碼片段是等價的:

ES5:

function fullName() { return this.firstName + ' ' + this.lastName } 
fullName.dependencies = ['firstName', 'lastName']; 
Object.defineProperty(
    Welcome.prototype, 
    'fullName', 
    { 
    get: fullName, 
    enumerable: true 
    }); 

ES6/ES7:

@computedFrom('firstName', 'lastName') 
get fullName() { 
    return `${this.firstName} ${this.lastName}`; 
} 

http://aurelia.io/docs.html#adaptive-binding

+0

感謝您的......這正是我希望聽到的!是的,我完全同意你,我應該爲此創建自己的工廠(讓我想知道爲什麼它被拿出來了!)感謝您的幫助:) – Phil