我希望Marko.js组件发出一个事件和一个值,然后我希望包含的组件监听事件并访问该值。
我有一个简单的按钮组件,如下所示:
class {
doSomething() {
this.emit('buttonClicked', {someValue:'10'});
}
}
<button.example-button on-click('doSomething')>Click me!</button>
然后包含的组件看起来像这样......
class {
onButtonClicked(data){
console.log("I heard event:" + data.someValue);
}
}
<div class="button-manager">
<my-button on-buttonClicked('onButtonClicked') />
</div>
这可以正确地使用值记录事件。但是我有点困惑,因为我希望容器中的语法引用事件监听器中传递的参数......就像这样......
<div class="button-manager">
<my-button on-buttonClicked('onButtonClicked', data) />
</div>
然而,然后会找出一个空对象。如果我将一个字符串作为记录字符串的参数,并覆盖从发射器传递的原始数据参数。
这是预期的行为吗?
答案 0 :(得分:1)
鉴于以下内容并继续您的示例:
class {
onButtonClicked(foo, bar, eventArg){
console.log('foo:', foo);
console.log('bar:', bar);
console.log('eventArg:', eventArg);
}
}
$ var foo = 'foo';
$ var bar = 'bar';
<div class="button-manager">
<my-button on-buttonClicked('onButtonClicked', foo, bar) />
</div>
发出buttonClicked
时的输出如下:
foo: foo
bar: bar
eventArg: { someValue: 10 }
在事件处理程序的方法名称之后传递的其他参数将在参数的开头传递给事件处理程序方法。请参阅:http://markojs.com/docs/components/#codeon-eventmethodname-argscode
旁注:这是为了反映Function.prototype.bind
除非您想要传递给事件处理程序方法的其他数据(调用this.emit()
时未提供的数据),否则无需绑定任何其他参数。
希望能回答你的问题。