backbone.js - 骨干，当您多次调用 render() 时会发生什么

Question

我见过有人在监听模型更改时调用 this.render() 的例子。

initialize : function() {
    this.listenTo(this.model, "change:someAttribute", this.render());
    this.listenTo(this.model, "change:someOtherAttribute", this.render());
}

如果 render() 函数正在从某个下划线模板创建视图并将其附加到 html 文档，那么最初附加的现有 HTML 会发生什么情况？如果我在其中一个视图字段中选择了一个下拉列表和一些文本，为什么在调用 render() 函数时它们不重置为默认值？

Answer 1

如果将整个元素 html 替换为

this.$el.html( _.template( htmlString, data ) );

如果你只是附加到它

this.$el.append( _.template( htmlString, data ) );

根据您设置应用程序的方式有不同的场景，但我认为您将主要使用渲染方法替换整个元素，然后您将拥有一个绑定到集合更改的事件侦听器，因此如果将模型添加到您将子视图附加到主视图的集合 el。

var view1 = Backbone.View.extend({
 el: '#view1div',
 initialize: function(){
  this.collection.bind('reset', this.render, this);
  this.collection.bind('add', this.addElement, this);
 },
 render: function(){
  this.$el.html( '<ul id="list"></ul>' );
 },
 addElement: function(){
  $('#list').append( '<li>something</li>' );
 }
});