input submit할 때만 정보 가져오기

import "./App.css"
import React, { useState, useEffect } from "react"
function App() {
  const onChangeInput = (e) => {
    e.preventDefault()
    const text = e.target.text1.value
    const check = e.target.check.checked
    console.log(text)
    console.log(check)
  }

return (

<div>
  <form onSubmit={onChangeInput}>
    <input type="checkbox" name="check" />
    <input name="text1" />
    <button type="submit" value="추가">
      추가
    </button>
  </form>
</div>

)
}

export default App

이러한 방법을 사용할 경우 onChange를 사용하지 않기 때문에 하위컴포넌트들이 재랜더링 되지 않고 submit하는 경우에만 정보를 가져오기 때문에 효율적으로 사용할 수 있다.

코드를 보면 e.target.input의 name.value 또는 e.target.input의 name.checked 등으로
정보를 가져올 수 있는데 각각의 input type에 따라 가져오는 방법이 다른듯하다