Question

我有一个在另一个视图（InnerView）内呈现的Backbone视图（OuterView）。两者都包含click事件的事件处理程序，并且启用了事件委派（默认情况下）。

我希望InnerView在事件进一步传播之前将一些数据附加到事件中。但是，代码 - 如下所示 - 似乎根本不会影响e.data，因为之后仍然未定义：

var InnerView = Backbone.View.extend({
  events: {
    "click": "onClick"
  },
  render: function () {
    // ...
  },
  onClick: function (e) {
    e.data = e.data || {};
    e.data.myData = 123;
    console.log(e.data); // Object { myData: 123 }
  }
});

var OuterView = Backbone.View.extend({
  events: {
    "click": "onClick"
  },
  render: function () {
    // ...
    this.$el.append(new InnerView);
    // ...
  },
  onClick: function (e) {
    console.log(e.data); // undefined
  }
});

我尝试阻止事件传播，然后使用自定义数据重新触发它（这将以稍微不同的格式存储，因为我无法在此处看到将数据附加到事件对象的方法）：

// alternative version of InnerView#onClick()
onClick: function (e) {
  e.stopImmediatePropagation();
  this.trigger('click', {myData: 123});
}

但是OuterView根本没有收到任何点击事件。

我该如何处理这个问题？请注意，我无法在目标视图上直接触发我的事件（或调用方法，或设置属性），因为两者并未相互暴露（这就是为什么我决定使用事件机制）。

Answer 1

您无法使用1 North East Baker St 890 North Sonoita Ave 180 South Swan Rd，因为这是使用Backbone的事件API，而不是jQuery＆＃39}。您需要OuterView从InnerView监听此事件，但正如您所说，视图不会相互暴露。

如果您想在DOM上发送数据，我认为您在转向jQuery's trigger时走在正确的轨道上。但是，我会从InnerView触发自定义事件：

this.trigger()

这样，点击事件传播可以正常进行，OuterView可以专门监听自定义事件

：

onClick: function () { this.$el.trigger('custom', { myData: 123 }); }

此外，请注意将自定义数据作为第二个参数传递给事件处理程序的便利。

在传播之前使用自定义数据扩展事件

1 个答案: