9

以下を使用して、すべてのリージョンをオーバーライドしてフェードトランジションを追加できることを知っています。

Marionette.Region.prototype.open = function(view){
  this.$el.hide();
  this.$el.html(view.el);
  this.$el.fadeIn()
}

特定の領域またはビューのみをオーバーライドする方法はありますか？レイアウトに特定の領域があり、フェードインできるようにしたいのですが、他の領域はすぐにレンダリングする必要があります。

ありがとう、

dk

4

2 に答える 2

16

Regionバックボーンオブジェクトを定義する方法でカスタムを定義し、このコードをそのリージョンタイプに追加できます。


MyRegion = Backbone.Marionette.Region.extend({

  el: "#some-element",

  open: function(view){
    this.$el.hide();
    this.$el.html(view.el);
    this.$el.fadeIn();
  }

});

MyApp.addRegions({
  myRegion: MyRegion
});

elリージョン定義にを含めたことに注意してください。これを複数のリージョンで再利用する場合は、ベースリージョンを作成し、必要なリージョンごとにベースリージョンを拡張する必要があります。


FadeInRegion = Backbone.Marionette.Region.extend({

  open: function(view){
    this.$el.hide();
    this.$el.html(view.el);
    this.$el.fadeIn();
  }

});

MyApp.addRegions({
  myRegion: FadeInRegion.extend({el: "#some-element"}),
  anotherRegion: FadeInRegion.extend({el: "#another-element"})
});
于 2012-08-09T21:14:04.947 に答える
-1

私が使用した別のオプションは、アニメーションの open メソッドをオーバーライドすることでした。それは、別の構成ファイルを作成し、その構成ファイルで open メソッドをオーバーライドし、className をテストする条件付きロジックをオーバーライドすることでした。そこで、コーヒー スクリプトと Marionette モジュールを使用して行ったことを次に示します。

ビューを作成します。

@Item.module "ItemApp.Add", (Add, App, Backbone, Marionette, $,_) ->

    class Add.Item extends Marionette.ItemView

        template: "#add-item"
        className: "add-modal"

私の設定ファイルでは、目的のアニメーションを実行するために className をテストするだけです:

do (Marionette) ->
    _.extend Marionette.Region::,
        open: (view) ->
            if view.el.className == "add-modal"
                console.log "the add-modal has been called"
                @$el.hide()
                @$el.html(view.el)
                @$el.show().animate "left": '0', queue: false
于 2013-06-19T13:39:14.113 に答える