区分论点和反应事件
Distinguish between arguments and react events
本文关键字:事件 更新时间:2023-09-26
两个处理程序(位于Reactjs应用程序的不同部分)调用相同的函数。
一个地方:
Foo.bar({key: 'value'});
其他地点:
<a onClick={Foo.bar}>
在最后一种情况下,除非我将其更改为Foo.bar.bind(null,null),否则bar函数的第一个参数将是React事件对象。
有没有一个好的方法来处理这个问题,在酒吧里知道它是被传递了一个参数还是只是一个React事件?无需在使用该函数的任何位置绑定null作为参数。这似乎不是一个很好的解决方案,因为稍后更改参数的数量需要使用该函数检查所有位置。
在以这种方式调用的所有函数中检查React事件对象的某些键,以确保传递的是参数,而不是React事件。
我可能有两个独立的函数:
Foo.bar({key: 'value'});
和
<a onClick={Foo.barClick}>
其中CCD_ 1调用CCD_。
如果您使用支持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' })}>
相关文章:
- 分派点击事件并保留击键修饰符
- 模糊事件的Javascript测试
- keyup事件处理程序更改焦点不适用于快速键入
- 使用 jQuery 的 .on 函数如何获取事件的原始元素
- 如何使Javascript动态html表及其上的事件
- 使用类从一个标记中双击事件
- 如何在未直接触发的情况下停止事件
- 如何在elfinder插件(一个文件管理器插件)上获得上传前事件
- 对iPad上的点击事件反应缓慢
- 事件和状态
- Fancybox是否将Click事件静音
- 主干-不管怎样,检查事件以前是否绑定过
- 从控制器返回后Ajax启动事件激发
- 如何从画布上的某个移动事件中获取X和Y
- Jquery:未触发select事件
- JsFiddle上的鼠标事件不起作用
- 只覆盖箭头键滚动事件
- $window.ga在AngularJS事件中未定义
- cron作业与Javascript计时事件
- ng更改事件不适用于Dropdown