Question

尝试解决涉及this的问题时，我已经将头砸墙了几天。当我在this.model上呼叫initialize时，它会正确返回联系信息，尽管我编辑信息并单击保存按钮后，this.model会出现undefined。经过一番搜索和大量控制台日志后，看来this正在点击按钮之后。理想情况下，保存按钮将比较先前的值和更新的值，然后在将模型推送到数据库之前对其进行更新。这是我目前凌乱的initialize的样子：

initialize: function(contact) {
  this.listenTo(App.Emitter, 'contacts:edit', this.render);
  this.template = window['JST']['editContact'];
  this.collection = App.Contacts2;

  if (contact.model) {
    console.log('INITIALIZE CONTACT HAS A MODEL', contact) // shows correct data
  }

  $('.save').on('click', this.save.bind(this))
  // this.$('.save').on('click', (contact)=> this.save(contact)) <--- also tried with no success

}

但是，一旦我们进入save函数，一切都会变得一团糟。点击后，我得到console.log，其中显示了按钮属性的this，而不是传递的信息：

save: function(contact) {
  console.log('SAVE FUNCTION START: ', contact, this) //contact= button's 'this', this= object with view's 'this' but no contact information

  if (contact.model) {
    this.yay = contact.model
    console.log('save function', this.yay) // doesn't show up :(
  }

  console.log('secondary model', this.yay) // undefined
}

有人能帮助我理解为什么this如此固执吗？我只需要联系数据即可保存到保存功能。

Answer 1

感谢大家的帮助。我发现我的解决方案包括两个部分：

首先，我需要将事件绑定在render函数中，而不是Initialize函数中。

其次，尽管我不完全确定为什么这样做，我需要在render函数中而不是在事件中添加一个新的事件侦听器。

以下是添加了2行的render函数的外观：

    render: function() {

    this.$el.html( this.template() );
    this.editContact();
    $('.saveEdit').on('click', _.bind(this.save, this))
    this.listenTo(App.Emitter, 'save', this.save())
    return this;
},

指向错误“ this”的范围问题

1 个答案: