후크 문서와 일부 블로그를 살펴보면 useRef ()를 사용할 때 변경 가능한 값이 저장되어 있음을 이해합니다.
문서 :
주로 DOM에 액세스하는 방법으로 refs에 익숙 할 수 있습니다. ref 객체를 React with으로 전달하면 React는 해당 노드가 변경 될 때마다 해당 DOM 노드에 .current 속성을 설정합니다.
그러나 useRef ()는 ref 속성보다 더 유용합니다. 클래스에서 인스턴스 필드를 사용하는 방법과 유사하게 변경 가능한 값을 유지하는 데 편리합니다.
이것은 useRef ()가 일반 JavaScript 객체를 생성하기 때문에 작동합니다. useRef ()와 {current : ...} 객체를 직접 만드는 것의 유일한 차이점은 useRef가 모든 렌더링에서 동일한 ref 객체를 제공한다는 것입니다.
이것은 변수를 선언하고 사용하는 것보다 어떤 이점을 제공 let
합니까?
코드 예 :
import React, {useRef} from "react";
const MyFunctionalComponent = (props) => {
const refVariable = useRef('value');
//versus
let letVariable = 'value';
}
후속 조치 : 제공된 답변은 도움이되었으며 일부 테스트와 결합하여 필요한 이해를 얻었습니다. 누군가가 개념에 문제가 있음을 알게되면 지금 이해하는 방식은 다음과 같습니다.
클래스 구성 요소에 대해 이야기하고 있다면, 예를 들어 생성자에서 클래스 인스턴스에 연결된 변수를 정의한 this.someValue = {};
다음을 통해 필요에 따라 참조 할 수 this.someValue
있습니다.
그러나 기능적 구성 요소에서는 이러한 인스턴스 변수를 가질 수 없으므로 를 사용해야 useRef
하며 동일한 기능을 제공합니다.
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다