함수형 컴포넌트에서 setState 2번실행문제

함수형 컴포넌트에서 동일 state값을 변경시키고자 하는 setState를 훅을 2번실행시

마지막 setState훅만 실행된다.함수형 컴포넌트에서 setState를 2번실행시 키값이 같다면

마지막 setState만 실행됐었는데 훅에서도 마찬가지로 마지막 state변경만 실행된다.

let addOne=()=>{
   setCount(count+1)
   setCount(count+2)
 }

위의 예제에서 2번째 setCount만 실행된다.

const [count, setCount] = useState(0);
 useEffect(()=>{
   setCount(count+1)
 },[count])

  return(
    <div>
      <button
        onClick={()=>{
          setCount(count+2)
        }
        }>
        +1
      </button>
      <hr/>
      {count}
    </div>
  )

useEffect를 사용하여 콜백으로 count+2실행후 count+1되는 콜백식으로 처리해보고자

했으나 초기 렌더링시 useEffect count +1증가=>count값변경=>useEffect실행

되는 무한루프에 빠졌다.

결국 동일한 state값을 두번변경하고자 하는경우

클래스형 컴포넌트에서 함수형 setState두번실행해야 된다는 결론을 얻었다.