Onclick

関数宣言

export default function Hello() {

  function showName() {
    console.log('hackjoong')
  }


  return (
    <div>
      <button onClick={showName}>Show name</button>
    </div>
  )
}

矢印関数

export default function Hello() {
  return (
    <div>
      <h1>Hello</h1>
      <button onClick={() => { console.log(29) }}>Show age</button>
    </div>
  )
}

Onchange

関数宣言

export default function Hello() {

  function showText(e) {
    console.log(e.target.value)
  }

  return (
    <div>
      <h1>Hello</h1>
      <input type='text' onChange={showText}></input>
    </div>
  )
}

矢印関数

export default function Hello() {
  return (
    <div>
      <h1>Hello</h1>
      <input type='text' onChange={(e) => {
        console.log(e.target.value)
      }}></input>
    </div>
  )
}