2011-12-23 9 views
13

私は、MVCフレームワークとしてbackbone.jsを使用してタブメニューコンポーネントを作成しています。ユーザーがタブをクリックすると、コンポーネントがタブを切り替える(内部操作)が、コンポーネントのリスナーがイベントに関連付けられたアクションに応答するようにします。この背後にあるアイデアは、さまざまなクリックを特定のアクションに抽象化していることです。例えば、各タブのモデルは、次のような構造を持つハッシュです:Backbone.js - トリガを使用してイベントをトリガしてデータを渡す

{ 
    label : <string>, 
    actionCommand : "save", 
    tabClass : <string> 
} 

リスナーは「アクション」に応答しますが、その後の特定を転送するようにトリガされるイベントは、「アクション」と呼ばれますコマンド。例えば:

this.trigger("action", {actionCommand: "save"}); 

は順番にリスナーを次のように同様のイベントを処理します:

handleAction : function(event) { 
    if (event.actionCommand == "save") { 
    ...do something... 
    } 

}

が、これは可能ですか?私はドキュメントからこれを集めることができませんでした。あなたが提供できるどんな洞察力にも事前に感謝します。

答えて

30

はい、これはバックボーンで可能です。

イベントモジュールを使用すると、オブジェクトがカスタムの名前付きイベントをバインドしトリガーできるようになります。

あなたのケースでは、イベントモジュールをメニューコンポーネントオブジェクトに追加することをお勧めします。このオブジェクトがバックボーンモデルである場合、それは既にイベントモジュールを持っています。ない場合は、あなたのリスナーがこの

MenuComponent.bind("action", this.handleAction, this); 

のように購読することができます

_.extend(MenuComponent, Backbone.Events); 

そして、次のコードを追加することができ、あなたはすでに

this.trigger("action", {actionCommand: "save"}); 
+0

が美しい言及したようにイベントをトリガすることができます!ハッシュがイベントオブジェクトにコピーされていますか? –

+0

ハッシュがコールバックに渡されます。この場合handleAction – Paul

+0

そしてデータを渡すのはどうですか???これは* action *のみを渡すためのものです... –

関連する問題