Question

我是Marionette的新手，无法理解事件......

我有一个触发事件的ItemView，我希望在应用程序级别收到此事件，但是当我的应用程序监听此事件时，没有任何反应......

如果Event Aggregator在Application和ItemView中，为什么这段代码不起作用？：

var MessageItemView = Backbone.Marionette.ItemView.extend({
  template: "#messagesTPL",
  tagName: 'tr',
  className: 'messageItem',
  events : {
    'click': 'displayMessage'
  },
  displayMessage: function () {
    this.trigger('display:message');
  }
});

App.on('display:message', function () {
  console.log('display message !!!');
});

Answer 1

如果您想在应用程序级别侦听事件，则必须在应用程序级别触发它：

displayMessage: function () {
  myApp.trigger('display:message');
}

假设myApp是您的木偶应用程序。然后，您只需听取该事件：

myApp.on('display:message', ...)

这是实现您要求的唯一方法：“我有一个触发事件的ItemView，我希望在应用程序级别接收此事件”。根据您的情况，更好的方法是

使用listenTo作为Andrew建议（请参阅此处的示例：https://github.com/davidsulc/marionette-gentle-introduction/blob/master/assets/js/apps/config/marionette/regions/dialog.js）。在该示例中，对话框区域侦听在视图上触发的“dialog：close”事件，并对其作出反应
使用控制器监听视图上的事件并做出正确反应，如下所示：https://github.com/davidsulc/marionette-gentle-introduction/blob/master/assets/js/apps/contacts/list/list_controller.js#L38控制器对视图中触发的“contacts：filter”事件作出反应，并对其作出反应

这两种解决方案都不需要“污染”全球事件空间。

Answer 2

好的，所以我尝试了listenTo解决方案，这是我的代码的一部分：

var regionManager = Backbone.Marionette.Region.extend({
    el: "#messages",
    onShow: function (view) {
        this.listenTo(view, "display:message", this.displayMessage);
    },
    displayMessage: function () {
        console.log('regionManager received display:message');
    }
});
App.addRegions({
    messageListRegion: regionManager

});
var MessageItemView = Backbone.Marionette.ItemView.extend({
    template: "#messagesTPL",
    tagName: 'tr',
    className: 'messageItem',
    events : {
        'click': 'displayMessage'
    },
    displayMessage: function (e) {
        e.preventDefault();
        e.stopPropagation();
        this.trigger('display:message');
    }
});

但是当我点击messageItemView时，regionManager不会执行listenTo方法中设置的displayMessage回调。

Backbone Marionette Event Aggregator：如何在App级别收听ItemView事件

2 个答案: