backbone.js - Backbone Marionette renderModel() 不适用于复合 View

Question

我正在使用复合 View 来显示带有 Backbone Marionette 的表格，但是在我对模型进行提取后数据进入时，让模板的包装器部分重新呈现时遇到了一些问题。这是我的模板:

复合 View 的模板:

<thead>
 <tr>
  {{#each report.columns}}
   <th>{{name}}</th>
  {{/each}}
 </tr>
</thead>
<tbody></tbody>

以及 ItemView 的模板:

{{#each cols}} <td>{{value}}</td> {{/each}}

在我的 Controller 函数中，我创建了模型的实例，创建并显示了 View ，然后进行提取以将我的数据放入模型中:

var tView = new tableCompositeView({collection: rowsCollection, model: configModel});
layoutView.tablecontent.show(tView);
rowsCollection.fetch();
configModel.fetch();

集合项正常，获取成功时更新 View 。但是，当 configModel.fetch() 完成时，复合 View 模板中的包装器位永远不会更新。

在文档中，它说您可以使用 .renderModel() 来仅重新渲染处理模型的 View 部分。当我这样做时:

configModel.fetch().success(function(){ tView.renderModel(); });

没有任何变化。但是当我使用 .render() 时:

configModel.fetch().success(function(){ tView.render(); });

它工作正常并且得到更新。这暂时可行，但它会重新呈现我的整个表格，这可能是一个性能问题

Answer 1

我认为文档在这种情况下具有误导性。 renderModel 返回渲染 View 的 html。它不会触及 $el。

source :

renderModel: function(){
  var data = {};
  data = this.serializeData();
  data = this.mixinTemplateHelpers(data);

  var template = this.getTemplate();
  return Marionette.Renderer.render(template, data);
},

如果您对按正确顺序呈现事物感兴趣，则不必担心显式调用 render。相反，您可以推迟显示 View ，直到您的模型获取完成。然后简单地调用 App.region.show(view);将为您准备好一切。

这里有一个 fiddle 来说明:http://jsfiddle.net/nEArw/12/

var metaPromise = Mod.metaModel.fetch({dataType: "jsonp"});
var tagsPromise = Mod.tagsCollection.fetch({dataType: "jsonp"});

metaPromise.done(function(data) {
    App.region.show(Mod.compositeView);
});

tagsPromise.done(function(data) {
    console.log("tags fetched!"); 
});

如果模型更新发生在您显示 View 之后并且您希望避免重新渲染整个组合，您可以在 compositeView 中使用 modelEvents 来更新单个元素。

https://github.com/marionettejs/backbone.marionette/blob/master/docs/marionette.view.md#viewmodelevents-and-viewcollectionevents

modelEvents: {
    "change:name": "nameChanged" 
 },

或者，如果您想更进一步，可以使用模型绑定(bind)插件。 https://github.com/theironcook/Backbone.ModelBinder