REACT || REACT NATIVE

[REACT NATIVE] 함수형 컴포넌트에서 this를 사용하라는 예시를 줄 때

(*ᴗ͈ˬᴗ͈)ꕤ*.゚ 2023. 3. 25. 20:56

문제 사항

개발을 하면서 라이브러리를 쓰게 되는데,

document를 보면, this를 사용한 예제를 종종 보게 된다

 

나는 함수형 컴포넌트와 Hooks을 주로 사용하는데

document는 클래스형 컴포넌트에 기준이 맞추어져 있는 상황...

 

나의 경우, react-native-echarts-wrapper 라이브러리를 사용하고 있었으며

setOption을 사용하려다가 맞닥뜨렸다

참고 https://www.npmjs.com/package/react-native-echarts-wrapper

 

 

해결 방법

useRef hook을 사용해서 접근하면 한다

..띠용 왜 이 생각을 못하고 있었지..

 

난 지식만 있었을 뿐 완전히 이해하지 못했고 그래서 적용을 하지 못했던 게 아닐까

 

useRef란?

useRef는 저장공간 또는 DOM요소에 접근하기 위해 사용하는 React Hook이다.

자바스크립트를 사용할 때, 특정 DOM을 선태갛기 위해 querySelector 함수를 사용하는데, React에서는 useRef Hook을 사용한다

 

참고 글

아주 명쾌하고 유용했던 링크

https://stackoverflow.com/questions/64197326/how-to-replace-the-this-in-the-functional-react-native-with-hooks

 

How to replace the 'this.' in the functional React Native with Hooks?

I'm trying to use the following react-native-echarts-wrapper but in my projects all my components are made using hooks. So, when I have a state variable that changes its state I want to execute the

stackoverflow.com