prevState

Park Bumsoo·2022년 3월 31일
0

prevState

	import { useState } from "react";

export default function StatePrevPage() {
  const [count, setCount] = useState(0);

  const onClickCount = () => {
    setCount(count + 1);
    setCount(count + 1);
    setCount(count + 1);
    setCount(count + 1);
  };

  return (
    <>
      <div>현재카운트: {count}</div>
      <button onClick={onClickCount}>카운트 올리기!!!</button>
    </>
  );
}

위처럼 카운트를 실행하는 함수가 있다 위 코드는
count+1을 4번했지만 1씩증가하게 된다.

위를 count+4가 되게하려면

	import { useState } from "react";

export default function StatePrevPage() {
  const [count, setCount] = useState(0);

  const onClickCount = () => {
    setCount((prev) => prev + 1);
    setCount((prev) => prev + 1);
    setCount((prev) => prev + 1);
    setCount((prev) => prev + 1);
  };

  return (
    <>
      <div>현재카운트: {count}</div>
      <button onClick={onClickCount}>카운트 올리기!!!</button>
    </>
  );
}

prev 함수를 사용하여 작성시 +4를 시킬 수 있다.

profile
프론트엔드 주니어 개발자(React, Next.js)

0개의 댓글