반응형
setUserInput({
...userInput,
enteredTitle: event.target.value
})
위와 같은 방법으로 상태를 업데이트하도록 코드를 작성했는데
이 방법도 틀린 것은 아니지만
동시에 수많은 상태 업데이트를 계획하고 있다면
오래되었거나 잘못된 스냅샷에 의존할 수도 있다.
이전 강의에서 말했듯이 setState가 값을 바로바로 변경하는 것이 아니라
업데이트 계획을 세우기 때문에 값 변경에 시간 차이가 발생할 수 있다.
그래서 아래와 같이 prevState를 이용해서 값을 적용해야 한다.
setUserInput((prevState) => {
return {
...prevState,
enteredTitle: event.target.value
}
})
즉 항상 최신 상태의 스냅샷에서 작업하도록 하는 더 안전한 방법이다
setState가 이전 state에 의존하고 있다면 반드시 이와 같은 형태로 함수를 작성해야 한다.
반응형
'온라인 강의 > React 완벽 가이드 [Udemy]' 카테고리의 다른 글
61. 양방향 바인딩 추가 (0) | 2023.06.02 |
---|---|
60. 양식 제출 처리 (0) | 2023.06.02 |
58. State 대신 사용하기(그리고 더 나은 방법) (0) | 2023.06.02 |
57. 여러 State 다루기 (0) | 2023.06.02 |
56. 사용자 입력 리스닝(listening) (0) | 2023.06.02 |