React-Hooks 공부 일기장 (3)
My 13th Post
03. React-Hooks 코딩 공부 일기장
by React Hooks Coding with Normad Corder
오늘은 useEffect( ) 에 대해서 정리하려고 합니다.
결론부터 말하자면 React의 DidMount, DidUnMount와 비슷한 역할을 수행한다고 합니다.
useEffect의 기본적인 형태는 아래와 같습니다.
useEffect(() => {
console.log(Mount Component);
}, [trigger]);
기본적으로 실행할 구문이 들어가는 console.log( )부분과,
어떤 컴포넌트가 변경되는 것을 감지할 것인지를 넣어주는 [trigger] 부분이 있습니다.
[trigger]부분을 생략하면 계속해서 실행부가 실행됨으로 한 번만 실행되도록 하고 싶다면 컴포넌트를 넣어야 합니다.
처음에 말한 것과 같이 컴포넌트가 Mount될 때와 DidMount, UnMount될 때 자동으로 실행되는 함수입니다.
프로그램을 만들다 보면 이런 시점에 실행해줘야 하는 코드들이 생기게 됩니다.
그럴 때 기존의 React처럼 여러곳에 작성을 해주지 않고 useEffect의 실행부에
코드를 작성하면 더욱 깨끗한 코드를 작성할 수 있습니다.
오늘은 useEffect( ) 에 대해서 포스팅 하였습니다.
React-Hooks 정리에 대한 3편의 포스팅을 마무리 하도록 하겠습니다.
차후 추가할 내용이 생기면 수정하도록 하겠습니다 !
안녕 ~ ~ !
Good Bye ~