[TIL] [React_hook] useState useEffect

uphoon·2022년 7월 28일
post-thumbnail

1. useState
상태값 변경 시 사용하는 리액트 훅 앞에 값에는 초기값이 할당되며 뒤에있는 값에는 함수가 들어온다.
여기서 중요한 점 useState 사용시 절대 초기값을 건드려서 수정되는 것이 아닌 뒤에 함수를 이용하여 현재 값을 바꾸는것
useState() 가로안에는 초기값을 설정해 둘 수 있다.
const를 사용해도 되는 돌아가는 이유는 뒤에 useState는 객체이다. setTitle로 값을 변경해서 리렌더링 되면서 현재값을 바꾸는 것
한마디로 title의 직접값을 입력하여 변경하는 것이 아닌 const를 사용하더라도 안에 값을 바꿀수 있으므로 사용이 가능하다고 한다.

const [title, setTtile] = useState()

2. useEffect
useEffect를 사용하면 마운트됬을때(처음 나타날때) / 언마운트(사라질때) 그리고 특정한 값이 업데이트 될때 특정 작업을 할 수 있게 해줍니다.

useEffect(() => {
  console.log('컴포넌트가 화면에 나타남');
  return () => {
    console.log('컴포넌트가 화면에서 사라짐');
  };
}, []);

[] 배열 안에 특정 한 값을 넣어줬을때 해당 값이 변할때 실행되게 할 수 도 있습니다.
[] 배열이 비어 있다면 최초 마운트시 실행 됩니다.
return 이후 나오는 함수는 cleanup함수라고 합니다.

너무너무 힘들다 집중도 잘 되지 않고...
그리고 왜이렇게 어려운것인가...

profile
혼자 끄적여보는 필기 저장소 | 잠깐쓰고 잊지말고 기록하는 습관.

0개의 댓글