useState
- 변수를 만들어주는 기능
const [변수명] = useState("담을 내용");
setState
- 변수 안에 담긴 데이터를 바꿔주는 기능
const [변수명, set변수명] = useState("담을 내용"); set변수명("바꿀 내용");
JS 변수인 let/const
를 사용하면, 값이 변경되었을 때 데이터만 변경되고(console에 출력하면 변경된 값이 나옴) 화면(document)에는 반영되지 않음
컴포넌트 변수인 state
를 사용하면 setState()
안에서 화면을 새롭게 그리라는 명령이 실행되어 화면에도 반영됨
JS에서 만든 변수를 HTML에 바로 사용 가능
(document.getElementById
이런 거 안 써도 됨)