Search code examples
javascriptreactjscode-formatting

What is the right name of event handler? onClick or handleClick?


I believe keeping code consistent is kind of important stuff. Sometimes I mess my code with different handler names (working with Javascript). What is the right name for event handlers? onClick vs handleClick?


Solution

  • This is subjective, but what you would see the most is the following:

    • if you are creating component and exposing event hooks, those props would be on: onClick, onHover, onUsernameChanged, onError. From inside your components, these props are just functions you call on some event. You don't care what they do, your job is to just call them at the right time
    • if you are consuming another component, you want to add handling in response to these events, so you use handle: handleChange, handleClick, handleUserLogout, because your job is now to handle some event and make something happen in response to it. If you don't handle, no changes to the app state will be made