марионеточных вложенные макетов не смог показать вид

Question

В моем приложении я создаю вложенный вид макета, как показано ниже:

=> а вид макета приложения, которое имеет заголовок и тело областей

var AppLayoutView = Marionette.LayoutView.extend({ 
    el : "body", 
    regions: { 
     headerRegion: "#ecp_header", 
     bodyRegion: "#ecp_body", 
     contentRegion: "#home" 
    }, 

=> панели вид макета, который вложен в области тела из приложения макета

ECPApp.DashboardLayoutView = Marionette.LayoutView.extend({ 
    el: "#home", 
    regions: { 
     menuRegion: "#left-menu", 
     contentRegion: "#usr-dashboard" 
    }, 

родителя расположение (applayout) создает п добавляет набор бутстраповской вкладки содержимого панелей к DOM, так что вид макета ребенка (дас hboard lyt) можно использовать первую панель вкладок (#home), чтобы отобразить меню боковой панели и часть контента в этой первой панели вкладок.

Я рендеринг обе раскладки, как показано ниже: applayout:

расположение Приложения делает правильно и придает необходимые колонтитулов элементы в DOM. После рендеринга макета приложения я запускаю событие boostrap.tab.shown. В обработчике этого события я пытаюсь рисовать представление детского макета (dashboard lyt).

{ 
    render: function() { 
    // load and attach templates for header and body regions. 
    var headerView = new HeaderView({model:session}); 
    this.headerRegion.show(headerView); 

    var bodyView = new BodyView({model:session}); 
    this.bodyRegion.show(bodyView); 

    // finally trigger a bootstrap tab show event, so 
    // the rest of the content will be drawn on tabshown evt. 
    headerView.$el.find('a#home-tab').tab('show'); 
    }, 

    onTabShown: function() { 
    var self = this; 
    // create an instance of nested layout view and show it. 
    var dbLytView = new UserDashboardLayoutView(); 
    dbLytView.render(); 
    //self.contentRegion.show(dbLytView); 
    } 
} 

Теперь возникает проблема, когда я называю applayout.contentregion.show (dashboardlyt), вызывается ребенок расположение визуализируем и он загружает набор шаблонов для внутренних областей (меню слева, и содержание приборной панели). Но как только вызов рендера возвращается вызывающему (parent lyt), он пытается сделать представление (...) визуализированного представления, узел DOM исчезает.

Ниже приведен скриншот перед возвратом дочернего лита. Мы видим, что ребенок лит правильно добавил свои элементы.

Как только рендер возвращается, а родительский завершает метод show, элементы исчезают.

DOM элементов до рендеринга возвращается вызова:

После возврата вызова и родительского шоу выполняет

Можно видеть, что выделенный узел в указанном выше ПОС, не доступно больше , после выполнения метода show.

Что я здесь делаю неправильно?

Answer 1

Якоб прав, объявив, что метод визуализации - это совершенно неправильный подход.

Должно быть onRender.

{ 
    onRender: function() { 
    // load and attach templates for header and body regions. 
    var headerView = new HeaderView({model:session}); 
    this.headerRegion.show(headerView); 

    var bodyView = new BodyView({model:session}); 
    this.bodyRegion.show(bodyView); 

    // finally trigger a bootstrap tab show event, so 
    // the rest of the content will be drawn on tabshown evt. 
    headerView.$el.find('a#home-tab').tab('show'); 
    },