0

我已经解耦了我想要响应彼此事件的视图。我在 application.js 文件中添加了一个事件聚合器,并在第一个视图中从我的函数中触发了事件。不过,我似乎无法获得第二个视图来响应该事件。我查看了 Derrick Bailey 对事件聚合器的讨论和 documentcloud.github.io 的讨论。我一直无法找到适用于 coffeescript 的语法,而且我不确定如何翻译我找到的语法。

我想要发布活动的第一个视图如下所示:

class Mlp.Views.PoniesIndex extends Backbone.View

  poniesTemplate: JST['ponies/index']

  events:
    'submit #new_pony': 'createPony'
    'click #pony_up': 'ponyUp'

  initialize: ->
    console.log(Mlp.Collections.Settings)
    @collection.on('reset', @render, this)
    @collection.on('add', @appendPony, this)
    @collection.on('change', @render, this)

  ponyUp: (event) ->
    event.preventDefault()
    Mlp.vent.trigger('ponyUp', @collection)
    @collection.ponyDown()
    @collection.ponyUp()

我的事件聚合器位于 application.js 文件中:

//= require jquery
//= require jquery_ujs
//= require underscore
//= require backbone
//= require mlp
//= require_tree ../templates
//= require_tree ./models
//= require_tree ./collections
//= require_tree ./views
//= require_tree ./routers
//= require_tree .

Mlp.vent = _.extend({}, Backbone.Events);

当我将它添加到我的 application.js 文件时,我得到了我想要的控制台日志:

Mlp.vent.bind("ponyUp", function(collection){
 console.log("pony up!");
});

但是,当我尝试在视图中添加事件绑定器时,我想接收已发布的事件,但我什么也得不到:

class Mlp.Views.SettingsIndex extends Backbone.View

  template: JST['settings/index']

  events:
     'submit #new_setting': 'createSetting'
     'click #change_of_venue': 'randomSetting'

  initialize: ->
    @collection.on('ponyUp', @alterbox, this) 
    @collection.on('reset', @render, this)
    @collection.on('add', @appendSetting, this)
    @collection.on('change', @render, this)

  alertbox: (collection) ->
    event.preventDefault()
    console.log("pony up!")

我尝试了各种不同的语法,但我仍然不确定我应该在初始化中绑定到集合还是在事件声明中绑定。我见过的例子使用下划线的_.bindAll。当我尝试它抛出“无法读取未定义的'绑定'”时,即使我的 application.js 中需要下划线。我确定这是一些我不明白的基本语法。

预先感谢您的任何帮助!

4

1 回答 1

0

您的收藏不会发送'ponyUp'事件,您的事件聚合器 ( Mlp.vent) 会。当你这样说时:

Mlp.vent.trigger('ponyUp', @collection)

您要求Mlp.vent发送一个'ponyUp'带有@collection作为参数的事件,而不是'ponyUp'@collection. 这意味着您要收听Mlp.vent该事件,并且:

@collection.on('ponyUp', @alterbox, this) 

应该看起来更像这样:

Mlp.vent.on('ponyUp', @alterbox, this)

或者,您可以通过以下方式手动触发集合上的事件:

@collection.trigger('ponyUp', @collection)

这两种方法的主要区别在于 usingMlp.vent允许任何人侦听事件,即使他们手头没有集合,而该@collection.trigger方法要求每个人在他们可以侦听事件之前都具有对集合的引用。

于 2013-08-08T21:24:05.110 回答