Sau khi Render sự kiện trên CompositeView với Backbone.Marionette

Question

Tôi có một CompositeView Marionette với một bảng điều khiển tìm kiếm và tập hợp các dữ liệu kết quả.

Tôi muốn gọi một hàm khi:

• bảng điều khiển tìm kiếm được trả lại.
• bộ sưu tập chưa được hiển thị.
• không nên gọi hàm này khi bộ sưu tập được hiển thị.

tôi đã làm nó theo cách này: (nhưng "afterRender" chức năng được gọi là hai lần)

// VIEW 
App.MyComposite.View = Backbone.Marionette.CompositeView.extend({ 
    // TEMPLATE 
    template: Handlebars.compile(templates.find('#composite-template').html()), 
    // ITEM VIEW 
    itemView: App.Item.View, 
    // ITEM VIEW CONTAINER 
    itemViewContainer: '#collection-block', 

    //INITIALIZE 
    initialize: function() {   
     this.bindTo(this,'render',this.afterRender); 
    }, 

    afterRender: function() { 
     //THIS IS EXECUTED TWICE... 
    } 

}); 

Làm thế nào tôi có thể làm điều này?

========================== EDIT =================== ===============

Tôi đã giải quyết nó theo cách này, nếu bạn có quan sát, hãy cho tôi biết.

// VIEW 
App.MyComposite.View = Backbone.Marionette.CompositeView.extend({ 

    //INITIALIZE 
    initialize: function() {   
     //this.bindTo(this,'render',this.afterRender); 
     this.firstRender = true; 
    }, 

    onRender: function() { 
     if (firstRender) { 
      //DO STUFF HERE.............. 
      this.firstRender = false;   

     } 
    } 

}); 

Answer 1

rối cung cấp một phương pháp onRender tích hợp sẵn trong tất cả các quan điểm của nó, vì vậy bạn có thể thoát khỏi những this.bindTo(this, 'render', this.afterRender) gọi:

// VIEW 
App.MyComposite.View = Backbone.Marionette.CompositeView.extend({ 
    // TEMPLATE 
    template: Handlebars.compile(templates.find('#composite-template').html()), 
    // ITEM VIEW 
    itemView: App.Item.View, 
    // ITEM VIEW CONTAINER 
    itemViewContainer: '#collection-block', 

    //INITIALIZE 
    initialize: function() {   
     // this.bindTo(this,'render',this.afterRender); // <-- not needed 
    }, 

    onRender: function() { 
     // do stuff after it renders, here 
    } 

}); 

Nhưng để làm cho nó không làm việc khi bộ sưu tập là không được trả lại, bạn sẽ phải thêm logic vào phương thức onRender để kiểm tra xem bộ sưu tập có được hiển thị hay không.

Điều này phần lớn phụ thuộc vào những gì bạn đang cố gắng thực hiện với kết xuất khi không có mục nào được hiển thị từ bộ sưu tập.

Ví dụ ... nếu bạn muốn hiển thị thông báo "Không tìm thấy mục", bạn có thể sử dụng cấu hình emptyView được tạo sẵn cho chế độ xem tổng hợp.

NoItemsFoundView = ItemView.extend({ 
    // ... 
}); 

CompositeView.extend({ 

    emptyView: NoItemsFoundView 

}); 

Nhưng nếu bạn có một số mã đặc biệt cần phải chạy và thực hiện một số điều không được bao gồm trong tùy chọn này, bạn sẽ phải đặt một số logic của riêng bạn.

CompositeView.extend({ 

    onRender: function(){ 
    if (this.collection && this.collection.length === 0) { 
     // do stuff here because the collection was not rendered 
    } 
    } 

}); 

Answer 2

Chỉ cần sử dụng chức năng onShow

Backbone.Marionette.ItemView.extend({ 
    onShow: function(){ 
    // react to when a view has been shown 
    } 
}); 

http://marionettejs.com/docs/marionette.view.html#view-onshow