Aurelia 2カスタム要素（すでに@を使ってビューを共有しています）は、ほぼ同じことをやっていますが、どのようにリファクタリングするのですか？ここ

Question

は私の問題です： オーレリアアプリ：

いくつかのカスタム要素（すでに@UseView経由でビューを共有する）はほぼ同じことをやって（特定のfuncは、すべての要素自体によって定義されることshoud）、共有コードを管理する方法（inkl @ bindable）？このリファクタリングする方法 ： https://gist.run/?id=897298ab1dad92fadca77f64653cf32c

Answer 1

、あなたの質問にを参照してください。「共有」のコードでは、共有のための本当に適していないとする、カスタム要素でライフサイクルに関連するものです。あなたは継承をする必要があり、多くの頭痛のために自分自身を設定しているカスタム要素で行う必要があります。

コードを共有するのではなく、可変なものに焦点を当てて、それらを構成可能にしようとしないでください。あなたの要点を見て、それはここで最も簡単な解決策と思われます。

プロパティが変更されたときに関数を呼び出すカスタム要素があるとします。この関数は、要素のいくつかのインスタンスでは異なる必要があります。あなたはそうのように、結合可能な機能とそれを達成し、行動は.callを使用することができます。

一部-element.js

import { bindable } from 'aurelia-framework'; 

export class SomeElement { 

    @bindable value; 
    @bindable processValue; 

    valueChanged(newValue, oldValue) { 
     if (this.processValue) { 
      this.processValue({ val: newValue }); 
     } 
    } 
} 

consumer.html

<some-element value.bind="myValue" process-value.call="myFunc(val)"></some-element> 
<some-element value.bind="anotherValue" process-value.call="anotherFunc(val)"></some-element> 

consumer.js

myFunc(val) { 
    console.log("val: " + val); 
} 

anotherFunc(val) { 
    console.log("val: " + val); 
}