首页   注册   登录
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
fancy2020
V2EX  ›  程序员

关于命名: onXXX 和 handleXXX 怎么区分

  •  
  •   fancy2020 · 36 天前 · 1968 次点击
    这是一个创建于 36 天前的主题,其中的信息可能已经有所发展或是发生改变。

    前端代码(react)中经常需要处理事件, 而事件处理函数的命名方式通常有(拿 click 事件举例):onClick 和 handleClick 这两种 。
    我发现自己这两种命名方式经常是混着的,强迫症不太能忍,想知道大家一般是怎么命名事件处理函数的。

    14 条回复    2020-05-31 01:53:25 +08:00
    hantsy
        1
    hantsy   36 天前   ❤️ 3
    <form onSubmit={handleLogin}/>

    <button onClick={increaseCounter} />
    hantsy
        2
    hantsy   36 天前
    onXXX 不是 react 内置的属性,看 React Form 那一篇。不大明白 React 。
    xianchenxy
        3
    xianchenxy   36 天前
    用动词,比如 do 、send...等等
    guyeu
        4
    guyeu   36 天前
    on 后面是动词,handle 后面是名词?
    sleepwalker
        5
    sleepwalker   36 天前 via Android
    个人一般用 handle 或其他动作来表明当前函数的作用,on 在传递 props 的时候用
    xiadd
        6
    xiadd   36 天前
    Mutoo
        7
    Mutoo   36 天前   ❤️ 3
    onClick: add a click event listener
    handleClick(Event): a handle function that deal with a click-event parameter
    czkm1320
        8
    czkm1320   36 天前
    插个眼,我也一直想知道
    crz
        9
    crz   36 天前
    onEvent 是组件定义,组件留了这个事件回调; handleEvent 是传递给这个组件的函数,用来处理这个事件
    iugo
        10
    iugo   36 天前
    官方文档给的建议挺清楚了:

    ```
    <button onClick={handleClick}>
    </button>
    ```

    https://reactjs.org/docs/handling-events.html
    lizz666
        11
    lizz666   36 天前
    我习惯用 handle
    otakustay
        12
    otakustay   36 天前
    onXxx 是被动的,你不知道具体会发生什么,其实现由外部指定
    handleXxx 是主动的,由你实现并明确知道会发生什么,通常通过 onXxx 交给外部
    我不是太喜欢 handleXxx,我更喜欢有明确语义说明会发生什么的函数名,然后传给 onXxx
    codermagefox
        13
    codermagefox   36 天前
    一点个人的理解:
    on 表动作.比如,我拉屎以后冲厕所,冲这个动作,应该是 on 冲厕所.
    handle 表处理事件.比如我拉屎以后,需要用一个事件来处理屎,这个事件就是 handleXXX.
    不清晰?

    如果你要(冲)厕所,就用 on 冲
    如果你要处理屎,就用 handleChange(屎)

    所以核心是,你当时是想做出行为还是想处理过程.
    JerryCha
        14
    JerryCha   35 天前
    onSomething -passing to-> handleSomething
    关于   ·   FAQ   ·   API   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   2770 人在线   最高记录 5168   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 12:55 · PVG 20:55 · LAX 05:55 · JFK 08:55
    ♥ Do have faith in what you're doing.