Backbone 将 Backbone 从 0.9 升级到 1.2 后查看事件未触发

Backbone View event not firing after upgrading Backbone from 0.9 to 1.2

我已经将我的 Web 应用程序从 Backbone 0.9.10 升级到 Backbone 1.2.1,除了一个例外,一切都很好。请看下面的代码:

define( ['underscore', 'backbone', 'text!templates/myResults.html'], function (_, Backbone, Template) {

  var myView = Backbone.View.extend({

    el: '#myResults',

    initialize: function (options) {
        this.targetLoc = options.targetLoc;         
    },

    events: function() {            
        var _events = {};
        _events ['show ' + this.targetLoc + ' a'] = 'tabClicked';           
        return _events;
    },

    tabClicked: function (e) {
        ....stuff....
    }

    template:  _.template(Template),

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

  });

});

return myView;

在我升级​​ Backbone 之前,我的 tabClicked 事件顺利触发。现在它没有触发,当我在 events 函数中 console.log(this.targetLoc); 时,它说 this.targetLocundefined.

我什至尝试添加:

this.events['show ' + this.targetLoc + ' a'] = 'tabClicked';

initialize函数无效。

此应用程序正在使用:

显然 Backbone 的 0.9 变为 1.2,关于如何解决我的问题有什么想法吗?

根据 changelog,在 1.2.0 中,视图委托事件的方式发生了变化

Views now always delegate their events in setElement. You can no longer modify the events hash or your view's el property in initialize.

因此您不能再依赖在 initialize 中设置的属性来动态创建事件哈希。但是,您还可以使用 constructor

plunker 上的快速 demo 显示这适用于 1.2.2。

var MyView = Backbone.View.extend({
  constructor: function(options) {
    this.eventTarget = options.eventTarget;
    Backbone.View.apply(this, arguments);
  },
  events: function() {
    var _events = {};
    _events['click ' + this.eventTarget] = 'clicked';
    return _events;
  },
  clicked: function(e) {
    console.log(e);
  },
  render: function() {
    this.$el.html('<a class="foo">click</a>');
  }
});

基本上,您应该能够通过将 events 依赖的逻辑移动到 constructor 而不是在 initialize 中来解决此更改。唯一需要注意的是,你必须记住调用 Backbone.View.

的原始构造函数

所以尝试用

替换你的initialize
constructor: function (options) {
    this.targetLoc = options.targetLoc;
    Backbone.View.apply(this, arguments);         
},