0

私はバックボーン/マリオネットjsを学んでおり、そのためにボイラープレートを使用しています: https://github.com/BoilerplateMVC/Marionette-Require-Boilerplate-Lite

2 つのビュー (ようこそ / ファイル) と 2 つの領域 (メインとヘッダー) を作成しました。

私のheaderRegionにはナビゲーションバーがあり、変更またはリロード時にメニューの「アクティブ」クラス（テンプレート：header.html）を処理したいのですが、それを行う最善の方法がわかりません

App.js で Region を定義しました:

App.addRegions({
        headerRegion:"header",
        mainRegion:"#main"
});

私のコントローラーでは、init で新しい HeaderView を作成します。

initialize:function (options) {
        App.headerRegion.show(new HeaderView(options));
}

そして、これは私の HeaderView です:

define([ 'marionette', 'handlebars', "App", 'text!templates/header.html'],
function (Marionette, Handlebars, App, template) {
    //ItemView provides some default rendering logic
    return Marionette.ItemView.extend({
        template:Handlebars.compile(template),
         initialize: function (options) {
          _.bindAll();
        },
        onRender : function(options){
          $('ul.nav li', this.$el).removeClass('active');
        }
    });
});

});

ご協力いただきありがとうございます ：） ！

4

1 に答える 1

0

マリオネットに関する著書で行っていることは、Backbone.picky を使用してアクティブなヘッダー モデルを管理し、その場合は適切な CSS クラスを追加することです。関連するヘッダー モデルの選択は、https ://github.com/davidsulc/marionette-gentle-introduction/blob/master/assets/js/apps/header/list/list_controller.js で確認できます。

そして、ユーザーが直接の URL (ブックマークなど) を介してアプリに入ると、適切なアクティブ ヘッダー ( https://github.com/davidsulc/marionette-gentle-introduction/blob/master/assets/js/など) を設定します。 apps/contacts/contacts_app.js )

于 2013-07-03T14:18:04.407 に答える