Backbone.Marionette Fade Transition chỉ dành cho các vùng cụ thể?

Question

Tôi biết tôi có thể ghi đè tất cả các vùng để thêm chuyển đổi mờ dần bằng cách sử dụng các bước sau.

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

Có cách nào để chỉ ghi đè các vùng hoặc chế độ xem cụ thể không? Tôi có một số khu vực nhất định trong bố cục của mình mà tôi muốn có thể mờ dần trong khi các khu vực khác phải được hiển thị ngay lập tức.

Cảm ơn,

dk

Answer 1

Bạn có thể xác định một tùy chỉnh Region cách bạn có thể xác định bất kỳ đối tượng Backbone, và thêm mã này vào loại khu vực.

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 
}); 

Lưu ý rằng tôi đã bao gồm el trong định nghĩa khu vực. Nếu bạn muốn sử dụng lại nó trên nhiều vùng, bạn sẽ phải tạo vùng cơ sở và mở rộng vùng đó cho từng vùng mà bạn cần.

Answer 2

Tùy chọn khác mà tôi vừa sử dụng là ghi đè phương pháp mở cho hoạt ảnh là tạo tệp cấu hình riêng biệt, ghi đè phương pháp mở trong tệp cấu hình đó và logic điều kiện để kiểm tra className. Vì vậy, đây là những gì tôi đã làm với kịch bản cà phê và sử dụng mô-đun Marionette.

Tạo điểm của tôi:

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

    class Add.Item extends Marionette.ItemView 

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

Và trong tập tin cấu hình của tôi, tôi chỉ kiểm tra className để thực hiện các hoạt hình mong muốn:

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