useRef로 변수 저장?

ReactuseRef는 html 요소(일반적으로 입력)를 참조하는 데 사용되는 후크입니다.

React 문서에서 useRef 정의를 읽는다면:

useRef returns a mutable ref object whose .current property is initialized to the passed argument (initialValue). The returned object will persist for the full lifetime of the component.



따라서 위의 내용을 읽으면 useRef를 사용하여 앱 수명 동안 변수를 유지할 수 있습니다.

function App() {
    const greeting = useRef("hello world")

    //  mutating the object
    ref.current = "goodbye world"
} 


일반 변수를 사용하지 않는 이유는 무엇입니까?



변수의 문제는 페이지를 새로 고치거나 구성 요소가 다시 렌더링될 때마다 변수가 다시 초기화된다는 것입니다.

useState는 어떻습니까?



물론 상태는 유지되지만 차이점은 상태를 업데이트하면 구성 요소가 다시 렌더링된다는 것입니다.

사용 사례는 무엇입니까?


useRef에 대한 사용 사례를 찾은 유일한 경우는 무한 스크롤 구성 요소를 빌드할 때입니다.

사용자가 페이지 끝에 도달하면 구성 요소는 페이지 토큰(현재 페이지를 나타냄)을 기반으로 더 많은 데이터를 가져옵니다. 페이지 토큰은 다음 페이지와 일치하도록 모든 후속 요청에서 업데이트되어야 합니다. 이것은 내가 직업에 적합한 useRef을 찾은 곳입니다.

이것이 제가 이 토론을 시작한 이유입니다. 변수를 저장하기 위해 useRef를 사용하는 것에 대한 귀하의 의견은 무엇입니까? 문제를 해결하기 위해 사용했습니까?

좋은 웹페이지 즐겨찾기