backbone.js - 在 Backbone 中执行 .destroy()

Question

我正在尝试对 Backbone 中的模型视图执行 DELETE 请求。但是，当单击链接时，Backbone 正在执行 GET 请求。如何强制模型视图破坏模型而不是获取它？

翡翠/HTML

script(type="text/template", id="allContactsTemplate").
  <td><%= first_name %></td>
  <td><%= last_name %></td>
  <td><%= email %></td>
  <td><%= description %></td>
  <td><a href="contacts/<%= _id %>" class="delete">Delete</a></td>

骨干JS

// Single Contact View
App.Views.Contact = Backbone.View.extend({
  tagName: 'tr',

  template: template('allContactsTemplate'),

  events: {
    'click .delete': 'deleteContact'
  },

  initialize: function() {
    this.model.on( 'destroy', this.unrender, this);
  },

  render: function() {
    var template = this.template( this.model.toJSON() );
    this.$el.html( template );
    return this;
  },

  deleteContact: function() {
    this.model.destroy();
  },

  unrender: function() {
    this.remove();
  }
});

Answer 1

您不会在<a>任何地方取消 的默认单击操作，因此单击您的.delete会做两件事：

1. this.model.destroy()应该触发 DELETE 请求的调用。
2. 触发通常的<a>行为，即 GETcontacts/some_id请求。

大概 GET 将在 AJAX DELETE 有机会做任何事情之前接管浏览器。您应该以通常的方式取消<a>' 的默认操作：

deleteContact: function(e) {
    e.preventDefault();
    this.model.destroy();
}

或者：

deleteContact: function() {
    this.model.destroy();
    return false;
}

你可能甚至不需要href那个<a>（除非你的 CSS 关心）。