Language/JavaScript

[React] setState

🥭맹2 2021. 10. 19. 17:31

setState는 비동기입니다.

그래서 기존의 상태 값에 새로운 값을 추가하기 위해서는 다음과 같은 코드로 작성해야합니다.

틀린 예시

const [chat, setChat] = useState([]);
socket.on('message', ({name, message}) => {
  setChat([...chat, {message, user}])
})

위와 같이 작성할 경우, chat이 누적이 되지 않고 단순히 값만 변경되는 현상 발생

 

올바른 예시

const [chat, setChat] = useState([]);
socket.on('message', ({name, message}) => {
  setChat(prev => [...prev, {name, message}])
})

https://ko.reactjs.org/docs/hooks-reference.html

 

'Language > JavaScript' 카테고리의 다른 글

[React] style-component 익스텐션  (0) 2021.10.20
[React] useEffect  (0) 2021.10.19
Number()와 parseInt() 차이  (0) 2021.08.21