【问题标题】:How To Find Triggered Event From Backbone.listenTo?如何从 Backbone.listenTo 中找到触发事件?
【发布时间】:2013-01-10 00:16:48
【问题描述】:

在 Backbone 中,我正在使用新的 Backbone.listenTo 事件。我的一个实例将侦听器附加到三个不同的事件,例如:

this.listenTo(this._Collection, 'reset add change', this._setCollection);

当它应该被适当地调用并且那里没有问题时。我不知道如何找出触发了哪个事件。我可以使用以下方法访问 e 参数:

_setCollection: function(e) {
    // Do fun stuff
}

问题在于e 参数仅发送集合的副本,并没有提及实际触发的事件。我试过e.typee.target 但这些对象不存在。这是来自 Chrome 开发工具的 e 对象的副本:

_byCid: Object
_byId: Object
_events: Object
    add: Array[1]
    change: Array[1]
    remove: Array[1]
    reset: Array[1]
__proto__: Object
_listenerId: "l16"
length: 3
models: Array[3]

如何找到触发的事件?

编辑:答案澄清:尽管标记的答案在技术上是正确的,正如 mu_is_too_short 所指出的,正确的答案是使用多个处理程序而不是执行这种类型的“诡计”

【问题讨论】:

    标签: javascript backbone.js backbone-events backbone.js-collections


    【解决方案1】:

    您无法直接检测事件类型,但在某些情况下,您可以从 arguments 推断它。 events catalog 有话要说:

    • “add”(模型、集合、选项)— 将模型添加到集合时。
    • "reset"(集合,选项)— 当集合的全部内容被替换时。
    • "change"(模型、选项)— 当模型的属性发生变化时。

    幸运的是,这三个事件都有不同的参数,因此arguments 的内容将唯一(在这种情况下)确定触发事件:

    1. 如果arguments[0] 是一个模型,arguments[1] 是一个集合,那么您就有一个"add" 事件。
    2. 如果arguments[0] 是一个集合,那么您就有一个"reset" 事件。
    3. 如果 arguments[0] 是一个模型,arguments.length 是 2,那么您就有一个 "change" 事件。

    所以你可以在你的_setCollection 中做一些不愉快和脆弱的事情:

        // M is your model, C is your collection.
        if(arguments[0] instanceof M
        && arguments[1] instanceof C) {
            // An "add" event...
        }
        else if(arguments[0] instanceof C) {
            // A "reset" event...
        }
        else if(arguments[0] instanceof M
             && arguments.length == 2) {
            // A "change" event...
        }
        else {
            console.log('confusion!');
        }
    

    演示:http://jsfiddle.net/ambiguous/Y9UUX/

    不过,我不推荐这种诡计,它很笨拙、易碎,而且如果您将更多事件类型添加到列表中,它可能会损坏。如果您的事件处理程序需要知道是哪种事件触发了它,那么您最好为每种事件类型使用单独的处理程序:三个函数和三个 listenTo 调用比一小堆丑陋的黑客要好。

    【讨论】:

    • 是的,完全同意。我发现了这个问题,因为我正在查看 remove 事件并将其全部包含在一个函数中。我注意到这些论点是不同的,应该把它放在问题中。无论如何,谢谢你的hackery。我将为每个使用不同的处理程序。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-09-24
    • 2015-11-18
    • 2022-01-19
    • 1970-01-01
    相关资源
    最近更新 更多