useEffect

• 컴포넌트가 처음 render 될 때만 코드가 실행되게 하기
• 첫번째 argument는 한번만 실행하고 싶은 코드
• 두번째 argument로 []빈 값이 오게 된다면 시작만 실행 []안 내용이 있다면 그 값이 변경될 시 실행
  

import './App.css';
import {useEffect, useState} from 'react'
function App() {
  const [keyword,setKeyword] = useState("")
  const [counter,setCounter] = useState(0);
  const onClick = ()=> {setCounter((prev)=>prev+1)}
  const onChange = (e)=>{setKeyword(e.target.value)}
  console.log("everytime!")
  const search = ()=>{
    if (keyword!==""){
    console.log(`search ${keyword}`)
  }}
  useEffect(search,[keyword])
  return (
    <div >
      <input value={keyword} onChange={onChange} placeholder='글적어'></input>
      <h1>{keyword}</h1>
      <h1>{counter}</h1>
      <button onMouseLeave={onClick}>+1</button>
    </div>
  );
}

export default App;

추후 추가 작성하기