親子ビューのイベントバインディングの関係

Question

親子関係でイベントを設定する場所については疑問に思っています。それは特定の問題ではなく、私が推測するベストプラクティスです。私の具体的なケース：

私はButtonとListを含むDropdownを持っています。アクションを説明するには、ボタンを押すとリストが表示されます。リスト内の項目をクリックすると、その項目が選択され、リストが消えます。

最初は、ビューがDropdownとして初期化されているため、作成する人は、ButtonまたはListビューにアクセスして対処する必要はありません。すべてのメソッドは親ビューで呼び出され、イベントは子プロセスからバブリングされる必要があります。ですから、例えば、代わりにやっての

：this.dropdown.button.press();、DropdownはちょうどButtonのプレスメソッドを呼び出し、独自のpress方法を提供します。

ユーザがボタンを押すと、Buttonは、Dropdownが聴いているイベントpressを発生させます。

onButtonPress : function() { 

    if (!this.isExpanded()) { 
     this.expand(); 
    } 

    this.trigger('press'); 
}, 

そしてDropdown開発者がdropdown.buttonに到達せずにプレスイベントを取得することができるように、自身にプレスをトリガします。

ここに最初の質問があります。 DropdownonButtonPressで自分自身を展開する必要があるか、onButtonPress押すだけをトリガする必要があり、その後、拡張がDropdownに耳を傾けてきた自身のpressイベント：

onButtonPress : function() { 

    this.trigger('press'); 
}, 

onPress : function() { 

    if (!this.isExpanded()) { 
     this.expand(); 
    } 
}, 

そして、それはより複雑になる、はずDropdownのexpand方法だけでトリガ自身のexpand：

expand : function() { 

    if (this.isEnabled()) { 

     this.setState('expanded', true); 

     this.trigger('expand'); 
    } 

    return this; 
}, 

onExpand : function() { 

    this.list.show(); 
}, 

またはそれがshowのList 1のようになります。

expand : function() { 

    if (this.isEnabled()) { 

     this.setState('expanded', true); 

     this.list.show(); 

     this.trigger('expand'); 
    } 

    return this; 
}, 

私は、親子関係のイベントをどこにバインドするかを決めるベストプラクティスについては疑問に思っています。どのように混乱している状況や可能性として循環的なイベントの呼び出しを避けるために。

誰でも意見はありますか？

Answer 1

イベントを手動でトリガーする代わりに、単にDOMを使用します。最初に親にヒットしたい場合はキャプチャをtrueに設定し、イベントをバブリングする場合はfalseを設定します。

これはそう親のDOM要素が最初のイベントを取得し、キャプチャ段階中に呼び出されるイベントハンドラを許可します。

el.bind('someevent', somefunction, true); 

これは泡、ひいては子どもたちは最初のイベントを受信し、子どもたちがイベントを受け取る際に、ハンドラが呼び出されます。

el.bind('someevent', somefunction, false); 

一般的には単純です。また、親が自分自身と子供のためのイベントを取得する委任プログラミングパターンを使用することもできます。混乱を避けることができ、大きなアプリケーションでメモリを節約できます。