4

音楽ライブラリ アプリを作成しているとします。

ジャンルのリストを含む 1 つのビューと、選択したジャンルのコンテンツを表示する別のビューがあります。ユーザーがリストのジャンルをクリックすると、それに応じて他のビューのコンテンツが更新されます。

依存関係を最小限に抑えるためにこれを行う最善の方法は何ですか?

個々のジャンルを描くビュー以外に、マウスのクリック音を聞く場所を見つけたことがありません。そこからイベントを送信できますが、そのイベントを取得して、ジャンルのコンテンツを描画する他のビューを更新する最適な方法は何ですか? そのイベント、ジャンル コンテンツ ビュー、またはそのコレクションを誰が聞く必要がありますか?

編集:アプリのルーターから両方のビューをインスタンス化し、ビューを互いに認識させることでこれを機能させることができましたが、もちろん最適ではありません。

4

2 に答える 2

14

アプリケーションの状態を保持するための単純なモデルを作成できます。特別なものは必要ありません。通常のバックボーンイベントメソッドを実装するデータのバッグだけです。

var AppState  = Backbone.Model.extend({});
var app_state = new AppState();

次に、ジャンルリストビューはクリックイベントをリッスンし（すでに持っているように）、誰かが変更したときにアプリ状態モデルに現在のジャンルを設定します。

var Genres = Backbone.View.extend({
    //...
    choose: function(ev) {
        // This would be the click handler for the genre,
        // `.html()` is just for demonstration purposes, you'd
        // probably use a data attribute in real life.
        app_state.set({genre: $(ev.target).html() });
    },
});

"change:genre"個々のジャンルのビューは、アプリ状態モデルのイベントをリッスンし、ジャンルの変更に応じて反応します。

var Genre = Backbone.View.extend({
    initialize: function() {
        _.bindAll(this, 'change_genre');
        app_state.on('change:genre', this.change_genre);
    },
    //...
    change_genre: function() {
        // Refill the genre display...
    }
});

デモ： http： //jsfiddle.net/ambiguous/mwBKm/1/

必要なデータのモデルを作成できます。モデルは、バックボーンでデータイベントを操作するための便利な方法です。追加のボーナスとして、このアプローチにより、アプリケーションの状態を永続化するのがかなり簡単になります。通常のバックボーン永続化サポートを追加するだけで、すぐに使用できAppStateます。

データ以外のイベントをプッシュするために単純なイベントバスのみが必要な場合は、BackboneのEventsメソッドを使用して単純なイベントアグリゲーターを構築できます。

app.events = _.extend({}, Backbone.Events);

次に、グローバル名前空間があると仮定するとapp、次のように言うことができます。

app.events.on('some-event', some_function);

と

app.events.trigger('some-event', arg1, arg2, ...);
于 2012-05-22T07:46:03.007 に答える
1

私が見てきた最良の方法は、Derick Baileyによって提案された方法です。つまり、さまざまなビューがサブスクライブできるイベントを発生させるための集中型オブジェクトを提供するイベント アグリゲーターを作成できます。このソリューションの優れた点は、Backbone の既存のイベント システムを利用するため、実装が非常に簡単なことです。

于 2012-06-04T04:04:01.823 に答える