区分参数和反应事件

Question

两个处理程序（在Reactjs应用程序的不同部分中）调用同一函数。

一个地方：

Foo.bar({key: 'value'});

其他地方：

<a onClick={Foo.bar}>

在最后一种情况下，除非我将其更改为Foo.bar.bind（null，null），否则bar函数的第一个参数将是React事件对象。

有没有一种好的方法来处理这个问题，在bar中知道它是否被传递了一个参数或只是一个React事件？ 无需在所有使用该函数的地方都将null绑定为参数。 这似乎不是一个很好的解决方案，因为以后更改参数数量将需要使用该函数检查所有位置。

在所有以这种方式调用的函数中检查React事件对象的某些键，以确保传递的是参数，而不是React事件也没有必要。

Answer 1

我可能有两个单独的功能：

Foo.bar({key: 'value'});

和

<a onClick={Foo.barClick}>

其中barClick调用Foo.bar(null)或类似名称。

Answer 2

如果使用ES6箭头功能支持从jsx编译代码，则可以使用下一个变体：

<a onClick={() => Foo.bar({ key: 'value' })}>

或者如果您需要事件对象：

<a onClick={event => Foo.bar({ key: event.prop })}>

您可以只使用匿名函数，但看起来更糟：

<a onClick={function() { Foo.bar({ key: 'value' }) }}>

如果没有箭头功能，匿名功能或新功能的创建，则只能通过使用bind方法（如您已经提到的那样）来实现：

<a onClick={Foo.bar.bind(Foo, { key: 'value' })}>