serializeData 函数与自定义数据的 Marionette.renderer

serializeData function vs Marionette.renderer for custom data

我注意到 Marionette 非常没有主见,因为他们让您可以自由选择呈现数据的方法。似乎有很多方法可以初始渲染带有自定义数据的模板

正在返回包含数据的模板:

template: function () {
    var myTemplate = $('.someTemplate')
    return _.template(myTemplate.html())({some: data});
}

非常相似:

    render: function () { 
        var template = this.getTemplate();
        var html = Marionette.Renderer.render(template, {
            model: this.model.toJSON(),
            customData: this.customData
        });

        this.$el.html(html);
    }

序列化数据:

serializeData : function () {
    var customData = {some: 'data'};
    var model = this.model.toJSON()
    return _.extend(customData, model);
}

我看到很多人在不同的代码中使用第一个和第二个的变体。我个人更喜欢使用 serializeData,但很好奇:是否有适合使用前两种方法而不是 serializeData 的优势或用例?

第一种情况效率不高 - 每次要渲染时都需要重新编译模板。

无论如何,您的用例正是 Marionette 拥有 templateHelpers 的原因。它是向模板提供额外数据同时还传递序列化模型的最简洁的方式。

所以你会写:

templateHelpers : function () { return {some: 'data'}; }

或者如果它只是静态的东西:

templateHelpers: {some: 'data'}

有关如何使用它的更多示例here

我认为这一切都是为了探索这些事物的自然行为。 Backbone 查看 render is empty function by default. Marionette ItemView render extends Backbone's with this code.

  1. 它通过 getTemplate 方法获取模板,默认情况下它给出存储在 template 选项中的内容。如果您想在多个模板之间进行选择,您可以覆盖 getTemplate
  2. 然后它收集需要通过运行 serializeData 呈现的数据并使用 templateHelpers 扩展它。默认情况下,第一个 returns 您的模型或集合 toJSON 方法结果,您可以在每次渲染时以某种方式准备数据。第二个是用于将在模板中需要时计算的助手(如果它们是函数)。
  3. 模板和数据然后转到 Marionette.Renderer,默认情况下只有 return template(data)。然后结果可以附加到视图的元素。