함수형 컴포넌트 x 함수 컴포넌트 o
리액트는 라이브러리지만 프레임워크로 이용
class 대신 function 사용
function LikeButton() {
const [liked, setLiked] = React.useState(false);
if (liked) {
return "You liked this.";
}
return (
<button
onClick={() => {
setLiked(true);
}}
>
Like
</button>
);
}
자바스크립트 구조분해 문법을 사용
구조분해
const [liked, setLiked] = React.useState(false); 는
const result = React.useState(false);
const liked = result[0];
const setLiked = result[1]; 과 동일
const {liked, setLiked} = React.useState(false);
객체와는 완전 다름
웹사이트에서 state 찾기 → 내용이 바뀌는 부분.
로그인 버튼 등 마우스 올렸을 때 바뀌는 부분이 모두 state