Backbone.js - 使用触发器触发事件​​并传递数据

Bre*_*mpa 14 javascript backbone.js backbone-events

我正在使用backbone.js作为MVC框架编写选项卡菜单组件.当用户单击选项卡时,组件将切换选项卡(内部操作),但我希望组件的侦听器响应与该事件关联的操作.这背后的想法是我将各种点击抽象为具体行动.例如,每个选项卡的模型都是具有以下结构的哈希:

{
    label : <string>,
    actionCommand : "save",
    tabClass : <string>
}
Run Code Online (Sandbox Code Playgroud)

将被触发的事件将被称为"动作",因此侦听器将响应"动作",但随后将转发特定命令.例如:

this.trigger("action", {actionCommand: "save"});
Run Code Online (Sandbox Code Playgroud)

反过来,监听器将处理事件,类似于以下内容:

handleAction : function(event) {
  if (event.actionCommand == "save") {
    ...do something...
  }
Run Code Online (Sandbox Code Playgroud)

}

这可能吗?我无法从文档中收集到这些信息.提前感谢您提供的任何见解.

Pau*_*aul 30

是的,这可以通过Backbone实现.

您可以使用"事件"模块允许对象绑定和触发自定义命名事件.

在您的情况下,您可能希望将Events模块添加到菜单组件对象.如果此对象是Backbone Model,那么它已经具有Events模块.如果没有,那么您可以使用以下代码添加它

_.extend(MenuComponent, Backbone.Events);
Run Code Online (Sandbox Code Playgroud)

然后你的听众可以这样订阅

MenuComponent.bind("action", this.handleAction, this);
Run Code Online (Sandbox Code Playgroud)

你可以像你提到的那样触发事件

this.trigger("action", {actionCommand: "save"});
Run Code Online (Sandbox Code Playgroud)

  • @SweetWisherツ,trigger中的第一个参数是事件(在本例中为“ action”)。传递给该函数的所有其他参数都可以捕获为事件处理程序参数(请参见http://backbonejs.org/#Events-trigger)。 (2认同)