backbone.js：了解浏览器事件处理和视图删除

Question

我正在摆弄一个看起来像这样的视图和相关模型：

App.Views.Addresses         = App.Views.Addresses || {};
App.Views.Addresses.Address = Backbone.View.extend({

  events: {
    "click button#foo"             : "clear"
  },

  initialize: function(model){
                this.address = model.model;
                this.address.view = this;
                _.extend(this, Backbone.Events);
                this.render();
              },

  render:     function(){
                ... rendering stuff
              },

  clear:      function(){
                this.address.clear();
              }
});

我

var Address = Backbone.Model.extend({

  url:   function() {
           ... url stuff
         },

  clear: function(){
           this.destroy();
           this.view.remove();
         }
});

在这里面临两个问题。第一个：

我的源代码中有一个 id="foo" 的按钮，希望视图捕获这个按钮的“click”事件并触发“clear”事件。问题：这不起作用。

无论如何，手动在我的模型上调用“clear”会干净地删除服务器上的数据，但不会删除视图本身。这是第二个问题。希望有经验的人能给我指点迷津。

提前谢谢 菲利克斯

Answer 1

第一个问题：

• 您的按钮必须位于视图呈现的元素内部。
  • 仅将主干范围事件发送到内部元素
• 您必须在 this.el 元素内渲染视图
  • 主干网使用该元素进行委派

第二个问题：

• 使用事件来破坏你的视图
  • 您不应将视图存储在模型中。这在 MVC 中是一种“不”。您的模型在删除时已经发出“删除”事件。您的视图应该倾听它并采取相应的行动。
• 您必须自己从 DOM 中删除视图元素
  • 这不是由骨干网处理的。

其他一般评论：

• 视图已经扩展了 Backbone.Events
• 使用 this.model 而不是 this.address