Backbone.Marionette嵌套的ItemView或者不呈現或呈現「空白」視圖/模板

Question

在導航到特定URL時，會觸發一個控制器方法，該方法會將一個ItemView加載到我的應用程序的某個區域中。這個ItemView本身（父類）將包含一些子ItemView，當它自身呈現時將它們全部渲染。這裏的父ItemView控件：

return Backbone.Marionette.ItemView.extend({ 
    template: Handlebars.compile(template), 
    ui: { 
     textInput01: "#text-input-01" 
    }, 
    events: { 
     // no events yet 
    }, 
    initialize: function() { 
     // no init yet 
    }, 
    onRender: function() { 
     this.appRoutefinderTextinputItemView = new AppRoutefinderTextinputItemView({parentView: this}); 

     $(this.ui.textInput01).html(this.appRoutefinderTextinputItemView.render()); 
    } 
}); 

而這裏的當前唯一的ItemView控件：

return Backbone.Marionette.ItemView.extend({ 
    template: Handlebars.compile(template), 
    events: { 
     // no events yet 
    }, 
    initialize: function() { 
     // no init yet 
    }, 
    onRender: function() { 
     // no onRender yet 
    } 
}); 

出於某種原因，我無法捉摸，但對孩子的initialize和onRender方法都被解僱，和所有必要的數據似乎在場，孩子要麼沒有被呈現，要麼以「空白」方式呈現，導致父母觀點不變。

據我瞭解，我不應該在子上調用render()，因爲它在實例化/引用ItemView時是隱含的嗎？即使當我放棄render()呼叫時，也會得到相同的結果。

我不得不假設從其他ItemViews渲染ItemViews的東西，我只是想念，但通過文檔瀏覽似乎沒有幫助。

第二個問題是：我是否以適當的方式實例化子視圖，還是有更好的方法來實現？

*編輯 - 所以經過一些嘗試，看起來「接受」的解決方案只是使父視圖佈局，這是一個擴展的ItemView。這確實有用。但是，我仍然想知道爲什麼ItemView中的ItemView不起作用。我是否打算在ItemView上集成手寫的render()方法，我是否保持這種方式？

Answer 1

與你原來的代碼的問題是這一行：

$(this.ui.textInput01).html(this.appRoutefinderTextinputItemView.render());

骨幹視圖的render方法不返回呈現的HTML。該方法執行渲染並更新視圖的el。該方法的返回值是視圖本身。木偶不會改變這種行爲。

您需要更改代碼以使用視圖的el來填充textInput01。另外請注意，this.ui.textInput01已經是一個jQuery選擇對象，所以你不需要再次打包。

this.appRoutefinderTextinputItemView.render(); 
this.ui.textInput01.html(this.appRoutefinderTextinputItemView.el);