Javascript 将参数传递给主干中的事件

Passing arguments to events in backbone

提问by chenglou

First of all, I did some search and no answer on stackoverflow/google provided me the thing I wanted.

首先，我做了一些搜索，但在 stackoverflow/google 上没有答案为我提供了我想要的东西。

Here's a snippet of my code:

这是我的代码片段：

//in the view
this.collection.on("add",triggerthis)
this.collection.add(predefinedModel)
triggerthis: function(a, b, c, d){
    //etc.
}

Basically, I want to be able to pass an argument on add and receive the argument in triggerthis. Is this possible?

基本上，我希望能够在添加时传递参数并在 triggerthis 中接收参数。这可能吗？

Thanks in advance.

提前致谢。

回答by mu is too short

You can't do this the way you want without using undocumented features.

如果不使用未记录的功能，您就无法按照您想要的方式执行此操作。

If we have a look at Collection#add, we'll see this:

如果我们看一下Collection#add，我们会看到：

add: function(models, options) {
  //...
  for (i = 0, l = add.length; i < l; i++) {
    (model = add[i]).trigger('add', model, this, options);
  }
  //...
}

Note the fourth argument to trigger. And if we look at the documented interface for trigger:

注意 的第四个参数trigger。如果我们查看记录的接口trigger：

triggerobject.trigger(event, [*args])

Trigger callbacks for the given event, or space-delimited list of events. Subsequent arguments to triggerwill be passed along to the event callbacks.

扳机object.trigger(event, [*args])

触发给定event或空格分隔的事件列表的回调。trigger 的后续参数将传递给事件回调。

So the addwill call the listeners as f(model, collection, options)where optionsis the same optionswhat you passed to Collection#add. The result is that if you do this:

因此，add将调用侦听器作为f(model, collection, options)whereoptions与options您传递给的内容相同Collection#add。结果是，如果你这样做：

this.collection.add(predefinedModel, { undocumented: 'arguments' })

then you could do this in your callback:

那么你可以在你的回调中做到这一点：

triggerthis: function(model, collection, options) {
    console.log(options.undocumented);
}

Demo: http://jsfiddle.net/ambiguous/bqWwQ/

演示：http: //jsfiddle.net/ambiguous/bqWwQ/

You could of course tunnel a whole array or object through optionsthis way.

您当然可以通过options这种方式隧道整个数组或对象。

The third argument for "add"events isn't documented (at least not that I can find), the closest thing to documentation for this is a note in the 0.3.3 Changelog entry:

"add"事件的第三个参数没有记录（至少我找不到），最接近文档的是0.3.3 更改日志条目中的注释：

The ubiquitous optionsargument is now passed as the final argument to all "change"events.

无处不在的options参数现在作为最后一个参数传递给所有"change"事件。

I wouldn't recommend this approach but it is there if you need it; you will of course need to cover this in your test suite and you'll need to make sure you don't use any keys in optionsthat Backbone will be using.

我不会推荐这种方法，但如果您需要它，它就在那里；您当然需要在您的测试套件中涵盖这一点，并且您需要确保您不使用optionsBackbone 将使用的任何密钥。

---

---

A safer approach would be to attach some extra properties to the model:

更安全的方法是将一些额外的属性附加到模型中：

model.baggage = { some: 'extra stuff };

and then peel that off in the callback:

然后在回调中剥离它：

triggerthis: function(model, collection) {
    var baggage = model.baggage;
    delete model.baggage;
    //...
}

Demo: http://jsfiddle.net/ambiguous/M3UaH/

演示：http: //jsfiddle.net/ambiguous/M3UaH/

You could also use different callbacks for different purposes or pass your extra parameters as full blown model attributes.

您还可以将不同的回调用于不同的目的，或者将您的额外参数作为完整的模型属性传递。

There's also _.bind:

还有_.bind：

this.collection.on("add", _.bind(function(collection, model, extra) { ... }, context, collection, model, 'whatever you want'));

but that will bind arguments from left to right so you'll have to specify allthe arguments that your callback will need.

但这将从左到右绑定参数，因此您必须指定回调所需的所有参数。

Demo: http://jsfiddle.net/ambiguous/jUpJz/

演示：http: //jsfiddle.net/ambiguous/jUpJz/

回答by jimr

If the values passed to the function are always the same, you can partially applyit using _.bind(or the native Function.bindif available)

如果传递给函数的值始终相同，则可以使用（或本机如果可用）部分应用它_.bindFunction.bind

E.g. Where you're binding the handler to add(assuming triggerThisis a method in your view):

例如，您将处理程序绑定到的位置add（假设triggerThis是您视图中的一个方法）：

this.collection.on('add', _.bind(this.triggerThis, this, a, b, c, d));

The definition of triggerThis:

的定义triggerThis：

triggerThis: function(a, b, c, d /*, model, collection, options - if you need them*/) {
  ...
}

If you want to pass arguments to an individualadd call, you can use the second optionsparameter to addand then handle that in your event handler.

如果您想将参数传递给单独的add 调用，您可以使用第二个options参数 toadd然后在您的事件处理程序中处理它。

E.g.

例如

this.collection.on('add', this.triggerThis, this);
this.collection.add(model, {
  someCustomValue: 'hello';
});

Then in your handler:

然后在您的处理程序中：

triggerThis: function(model, collection, options) {
  var val = options.someCustomValue;
  ...
}