3

我正在寻找一个与 require.js 一起使用的简单事件聚合器。我有两个模块，一个包含视图模型，另一个包含某种“侦听器”：

// view model
define(['lib/knockout-2.2.1', 'events/aggregator'], function(ko, events){

    var squareViewModel = function(contents) {
        this.click = function(){
            events.publish('squareClicked', this);
        };
    };

    return squareViewModel;
});

// some listener of some kind
define(['events/aggregator'], function(events){
    events.subscribe('squareClicked', function(e){
        alert("hurrah for events");
    });
});

有什么东西可以做到这一点吗？这种架构甚至是一个好主意吗？这是我第一次涉足客户端架构。

4

2 回答 2

4

这与您发布的内容相似，但是我在扩展 Backbone 事件方面很幸运（实际上，您不必使用有关 Backbone 的任何其他东西来工作），如下所示：

define(['underscore', 'backbone'], function( _, Backbone ) {
    var _events = _.extend({}, Backbone.Events);
    return _events;
});

然后您的所有视图模型（或任何代码）都可以使用它：

define(['knockout', 'myeventbus'], function(ko, eventBus){

    return function viewModel() {
        eventBus.on('someeventname', function(newValue) { 
        // do something
        });

        this.someKOevent = function() {
            eventBus.trigger('someotherevent', 'some data');
        };

    };
});

最初的想法来自Derick Bailey 的这篇文章。我最喜欢的客户端活动之一是 Jim Cowart 的这个

同样，它与您发布的内容几乎相同。但是，我不喜欢将其绑定到 jQuery 文档 DOM 节点的方法的一件事是，您可能还会有其他类型的事件从那里飞过，从子节点冒泡等等。而通过扩展主干事件，您可以拥有自己的专用事件总线（如果您想拥有单独的数据事件与 UI 事件，甚至可以拥有多个）。

关于此示例中的 RequireJS 的注意事项：Backbone 和 Underscore 与 AMD 不兼容，因此您需要使用shim config加载它们。

于 2013-04-23T01:04:30.777 回答
1

我最终使用 jQuery 来制作我自己的：

define([], function(){
    return {

        publish: function (type, params){
            $(document.body).trigger(type, params);
        },

        subscribe: function(type, data, callback){
            $(document.body).bind(type, data, callback);
        },
    };
});

它适用于我想要的用途，但尚未经过广泛测试。

正如 explunit 在他的回答中指出的那样，这将捕获任何事件document.body。this在访问传递的回调函数内部时，我还发现了一个范围问题。

于 2013-04-22T05:51:12.773 回答