생명주기 메서드
이거 공부하는 내내 진짜 많이 봤는데 솔직히 별로 이해하지는 못했던 것 같고 거의 외우다시피 해서 했었다. 근데 외우는 것도 사실 너무 생소해서 별로 잘 외우지는 못했었다. 오늘 수업 들으면서는 이거에 대해서 얘기 들었는데 여러번 듣기도 했고 설명 잘 해주셔서 이해가 좀 더 됐다. 그리고 무엇보다! 엄청난 깨달음은!
함수형 컴포넌트에서는 constructor componentDidMount componenetDidUpddate componentWillUnmount 를 직접 쓰는 걸 보여줬는데 물론 이건 이거대로 이해 잘 안 됐지만 useEffect 쓰는 건 심지어 이게 어딘지도 모르니까 잘 이해가 안 됐다.
let count = 0;
useEffect(() => {
setInterval(() => console.log(++count), 2000);
return (
clearInterval();
)
},[값이 들어갈 수도 있음])이렇게 예시 useEffect코드가 있을 때
setInterval부분이 componentDidMount(DOM이 완성됐을 때 처리하고 싶은 부분)이고
return 뒤의 부분이 componentWillUnmount(동작이 다 이루어진 뒤 필요없는 부분을 삭제하거나 아니면 그 뒤에 이루어졌으면 하는 부분을 넣음)이다!
그리고 deps부분이 componentDidUpdate(이 값이 바뀌면 useEffect의 componentDdiddMount 부분을 다시 실행하라)는 것이었다!
너무! 엄청나지 않아?! 아무도 이렇게 1대 1 대입되게는 설명 안 해줘서 '그니까 둘이 같다는 건 알겠는데 어케 같은 거임... 헷갈려 죽겠음...' 하면서 쓰고 있었는데! 하지만! 사실 내가 또 제대로 안 봤을지도! 내가 집중 안 했을지도! 모든 자료를 찾아보지는 않았을지도!
어쨌든 오늘 너무 큰 깨달음 얻었다!
