Question

我有两个ItemViews。

第一个视图应该触发一个事件，第二个视图应该监听触发器。我该怎么办呢？

这是我到目前为止所拥有的：

  Branch.RecipeView = Marionette.ItemView.extend({
    triggers: {
      'change': 'recipe:selected'
    }
  });

然后第二个视图如下：

  Branch.MetaDataView = Marionette.ItemView.extend({
    template: _.template(
      '<div id="branchImgSrc">' +
       '</div>' 
    ),
  initialize: function () {
    this.on('recipe:selected', function () {
       console.log('selected');
    });
  }
});

我实例化两个视图并将它们添加到布局中，但ItemView中的事件从不触发配方：在ItemView编号2中选择。

我是否以错误的方式思考这个问题？

Answer 1

您的问题的答案取决于您是否希望Branch.MetaDataView存储对Branch.RecipeView的引用，而不是使用某种外部机制进行事件消息传递。

如果您不介意引用Branch.RecipeView，可以使用listenTo获得所需内容：

recipeView = new Branch.RecipeView();

Branch.MetaDataView = Marionette.ItemView.extend({
  template: _.template(
    '<div id="branchImgSrc">' +
     '</div>' 
  ),
  initialize: function () {
    this.listenTo(recipeView, 'recipe:selected', function () {
      console.log('selected');
    });
  }
});

如果您不想直接引用另一个视图，那么您可以使用其他一些机制来传送'recipe:selected'事件。这可能是DOM，或者这可能是某种消息传递总线对象（类似于Backbone.Radio甚至只是_.extend({}, Backbone.Events);）。

如果您的Branch.RecipeView是Branch.MetaDataView el的孩子/后代，那么浏览DOM可能会有意义，因为您可以使用事件冒泡作为您的消息传递机制。要做到这一点，需要在Branch.RecipeView $el上触发一个事件，然后在Branch.MetaDataView上创建一个.on听众和回调（并且不要忘记在销毁视图时删除侦听器！）。

如果你想使用一个消息传递对象（如果你不是从子/后代视图中发出事件，那绝对是最好的方法），只需看一下Backbone.Radio自述文件，特别是{{{ 3}}部分是最简单的例子：
```
// Create a message bus
var myBus = _.extend({}, Backbone.Events);

// Listen in on the message bus
this.listenTo(myBus, 'some:event', myCallback);

// Trigger an event on the bus
myBus.trigger('some:event');
```

木偶触发方法和listenTo

1 个答案: