
前端代码(react)中经常需要处理事件, 而事件处理函数的命名方式通常有(拿 click 事件举例):onClick 和 handleClick 这两种 。
我发现自己这两种命名方式经常是混着的,强迫症不太能忍,想知道大家一般是怎么命名事件处理函数的。
1 hantsy 2020-05-30 10:03:09 +08:00 <form OnSubmit={handleLogin}/> <button OnClick={increaseCounter} /> |
2 hantsy 2020-05-30 10:04:44 +08:00 onXXX 不是 react 内置的属性,看 React Form 那一篇。不大明白 React 。 |
3 xianchenxy 2020-05-30 10:05:51 +08:00 用动词,比如 do 、send...等等 |
4 guyeu 2020-05-30 10:09:28 +08:00 on 后面是动词,handle 后面是名词? |
5 sleepwalker 2020-05-30 10:10:48 +08:00 via Android 个人一般用 handle 或其他动作来表明当前函数的作用,on 在传递 props 的时候用 |
6 xiadd 2020-05-30 10:11:28 +08:00 @sleepwalker 同 |
onClick: add a click event listener handleClick(Event): a handle function that deal with a click-event parameter |
8 czkm1320 2020-05-30 14:24:46 +08:00 插个眼,我也一直想知道 |
9 crz 2020-05-30 15:03:14 +08:00 onEvent 是组件定义,组件留了这个事件回调; handleEvent 是传递给这个组件的函数,用来处理这个事件 |
10 iugo 2020-05-30 15:24:31 +08:00 官方文档给的建议挺清楚了: ``` <button OnClick={handleClick}> </button> ``` https://reactjs.org/docs/handling-events.html |
11 lizz666 2020-05-30 15:35:00 +08:00 我习惯用 handle |
12 otakustay 2020-05-30 16:21:57 +08:00 onXxx 是被动的,你不知道具体会发生什么,其实现由外部指定 handleXxx 是主动的,由你实现并明确知道会发生什么,通常通过 onXxx 交给外部 我不是太喜欢 handleXxx,我更喜欢有明确语义说明会发生什么的函数名,然后传给 onXxx |
13 codermagefox 2020-05-30 16:37:31 +08:00 一点个人的理解: on 表动作.比如,我拉屎以后冲厕所,冲这个动作,应该是 on 冲厕所. handle 表处理事件.比如我拉屎以后,需要用一个事件来处理屎,这个事件就是 handleXXX. 不清晰? 如果你要(冲)厕所,就用 on 冲 如果你要处理屎,就用 handleChange(屎) 所以核心是,你当时是想做出行为还是想处理过程. |
14 JerryCha &nsp; 2020-05-31 01:53:25 +08:00 onSomething -passing to-> handleSomething |