javascript - Backbone.js subview 渲染

Question

我正在尝试掌握 Backbone.js，并一直遵循 Thomas Davis 概述的“模块化”方法。在这里。

当我尝试将一个 View “包含”在另一个 View 中时，我似乎陷入了困境，如下所示:

SettingsView.js

define([
  'jquery',
  'underscore',
  'backbone',
  'text!templates/settings/settingsTemplate.html'
], function($, _, Backbone, settingsTemplate){   

  var SettingsView = Backbone.View.extend({
    el: $("#interface"),

    render: function() {
      this.$el.html(settingsTemplate);
    }

  });

  return SettingsView;

});

ScriptView.js

define([
    'jquery', 
    'underscore', 
    'backbone',
    'views/settings/SettingsView',
    'models/script/ScriptModel', 
    'collections/scripts/ScriptsCollection',
    'text!templates/script/scriptTemplate.html'
],    
    function($, _, Backbone, SettingsView, ScriptModel, ScriptsCollection,  scriptTemplate) {

    var ScriptView = Backbone.View.extend({
        el : $("#container"),

        render : function() {
            this.$el.html(scriptTemplate);

            //add the settings view
            var settingsView = new SettingsView();
            settingsView.render();
        }
    });

    return ScriptView;
});

更新:我已经设法修复了我刚刚意识到为什么会发生这种情况的错误(参数顺序错误 - DOH!!)

我不再收到错误，但我的“SettingsView”仍然没有出现。当我在“ScriptView.js”中控制台记录此内容时，我看到“el”未定义，所以我的想法是这可能是问题所在......？

谢谢

Answer 1

我认为您必须将 SettingsView 附加到 ScriptView 的 el 中:

var ScriptView = Backbone.View.extend({
    el : $("#container"),

    render : function() {
        this.$el.html(scriptTemplate);

        //add the settings view
        var settingsView = new SettingsView();
        settingsView.render();

        this.$el.append(settingsView.el);
    }
});

关于 subview 的一篇很棒的文章是 this one .

希望对您有帮助!