Question

我想动态地在Backbone js应用程序中创建一些视图元素。初始化新视图时，我希望它将新元素插入DOM，将参考存储在view.el中，并像往常一样委托事件。

我知道我可以输入我的html，然后使用el：“＃test”设置一个视图，但这对于模式和其他不是Web应用程序核心的视图来说似乎有些过分。是否有规定的方法来执行此操作我在文档中遗漏了？我只是误解了观点应该如何运作？

Answer 1

骨干视图会为您生成el，无需您执行任何操作。默认情况下，它会创建<div>。但是，您可以生成所需的任何标记名称。实例化视图后，在视图上实施render方法，并使用HTML填充el。


MyView = Backbone.View.extend({});

var v = new MyView();
console.log(v.el); // => "<div></div>"


// define your own tag, and render contents for it

MyTagView = Backbone.View.extend({
  tagName: "ul",

  render: function(){
    this.$el.html("<li>test</li>");
  }
});

var v2 = new MyTagView();
v2.render();
console.log(v2.el); // => "<ul><li>test</li></ul>"

通常的做法是使用模板系统来渲染视图的HTML，例如Underscore.js模板，Handlebars或任何其他十几个模板JavaScript模板引擎。

从视图生成内容后，您需要先将其粘贴到DOM中，然后才能看到它。这通常使用jQuery或其他插件完成：

$("#some-element").html(v2.el);

如何动态创建Backbone视图元素？

1 个答案: