React Events

Events are user actions
Examples click change mouseover

Add Event in React

Use camelCase

plaintext

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

Example

plaintext

function App() {
  const handleClick = () => {
    alert("Clicked")
  }

  return <button onClick={handleClick}>Click</button>
}

Pass Arguments

plaintext

<button onClick={() => handleClick("Hello")}>Click</button>

Event Object

plaintext

function App() {
  const handleClick = (event) => {
    console.log(event.type)
  }

  return <button onClick={handleClick}>Click</button>
}

With Argument and Event

plaintext

<button onClick={(e) => handleClick("Hi", e)}>Click</button>

This will come in handy when we look at Form in a later chapter.