useEffect 정리

이자용·2022년 2월 19일
0
const element = useRef();
useEffect(()=>{
	if(element.current){
    	element.current.addEventListtener("click",onClick);
    }
    // [] 디펜던시가 없다면 componentDidMount, componentDidUpdate 호출 (업데이트 될때마다 호출)
    // [] 디펜던시가 있다면 위 function은 componentDidMount 일때만 호출 (componentDidMount 일때 한번만 실행)
    reutrn ()=>{
    	if(element.current){
	        element.current.removeEventListtener("click",onClick);
        }
        // componentWillUnMount 일때는 함수를 리턴한다.
        // component가 mount되지 않았을때 eventListener가 배치될필요 없음
    }
    
},[])

// [] 디펜던시가 없다면 componentDidMount, componentDidUpdate 호출 (업데이트 될때마다 호출)
// [] 디펜던시가 있다면 위 function은 componentDidMount 일때만 호출 (componentDidMount 일때 한번만 실행)
// componentWillUnMount 일때는 함수를 리턴한다.
// component가 mount되지 않았을때 eventListener가 배치될필요 없음

profile
이자용

0개의 댓글