Programming/React
useState의 비동기 처리
배칭 (Batching) const [value, setValue] = useState(0); const handleClick = () => { setValue(value + 1); setValue(value + 1); } handleClick은 value를 두 번 변경하기 위한 핸들러 함수이다. 하지만 막상 실행된 뒤 값을 확인하면 예상했던 값인 2가 아니라 1로 설정된 것을 확인할 수 있을 것이다. 위처럼 상태를 변경하는 세터 함수가 예상했던 것처럼 동작하지 않는 이유는 리액트가 세터 함수들을 모아 일괄적으로 처리(Batch Update)했기 때문이다. 일반적으로 리액트는 상태가 변경되면 변경된 내용을 반영하기 위해 컴포넌트를 다시 렌더링한다. 그런데 만약 페이지 내에 존재하는 수많은 상태값 하나하나..
2022. 7. 26.