React.js useEffect에서 useRef로 컴포넌트 참조 시 undefined 오류


React.js useEffect에서 useRef로 컴포넌트 참조 시 undefined 오류

<MyComp ref={myRef} /> 처럼 useRef로 컴포넌트를 참조하기도 합니다. 그런데 useEffect(..., [])를 이용해 초기화를 하면 아주 가끔씩 참조를 읽지 못하는 경우가 생깁니다. 이것은 ref가 할당되기 전에 useEffect가 실행돼서 일어나는 일입니다. useEffect(()=> { mapRef.current.setLevel(2); }, []); 할당되지 않아서 오류가 난다 그 해결책으로 useEffect 2번째 파라미터에 ref.current를 넣어주는 것입니다. 이 방법의 장점은 반드시 한 번은 이 경우 두 케이스를 생각할 수 있습니다. ref에 할당된 후 실행, ref에 할당되기 전 실행. 전자의 경우에는 current가 더는 바뀌지 않기 때문에 한 번의 실행이 확실시됩니다. 그러나 후자는 첫 실행에서 오류가 발생하고, 그 후에 정상 작동이 한번 일어납니다. 그래서 후자의 경우를 고려해 다음과 같은 코드를 추가합니다. if (!myRef.curre...


#hook #js #null #react #undefined #useEffect #useRef

원문링크 : React.js useEffect에서 useRef로 컴포넌트 참조 시 undefined 오류