변수를 선언하는 대신 useRef ()의 장점은 무엇입니까?

invertedSpear

후크 문서와 일부 블로그를 살펴보면 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';
}

후속 조치 : 제공된 답변은 도움이되었으며 일부 테스트와 결합하여 필요한 이해를 얻었습니다. 누군가가 개념에 문제가 있음을 알게되면 지금 이해하는 방식은 다음과 같습니다.

  • 인스턴스 변수를 가질 수 있지만 실제로는 즉각적이며 다시 렌더링 할 때마다 다시 초기화됩니다.
  • useRef ()는 useState ()와 같은 더 영구적 인 것을 제공하지만 업데이트는 재 렌더링을 트리거하지 않습니다. 체인 방식으로 많은 조작을 수행하는 경우에 매우 유용하지만 다음까지 다시 렌더링을 트리거하고 싶지는 않습니다. 끝
  • useState ()는 UI 요소에서 사용하는 변수에만 연결되어야합니다. 상태를 변경하면 전체 구성 요소가 다시 렌더링됩니다. 도중에 상태를 조작하는 일련의 작업이 없으면 체인이 끝날 때까지 참조를 사용하십시오.
Jayce444

클래스 구성 요소에 대해 이야기하고 있다면, 예를 들어 생성자에서 클래스 인스턴스에 연결된 변수를 정의한 this.someValue = {};다음을 통해 필요에 따라 참조 할 수 this.someValue있습니다.

그러나 기능적 구성 요소에서는 이러한 인스턴스 변수를 가질 수 없으므로 를 사용해야 useRef하며 동일한 기능을 제공합니다.

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

React Hooks-useEffect 외부의 변수 선언으로 요소 자식 (useRef 사용)을 대상으로 지정하는 방법은 무엇입니까?

분류에서Dev

!를 사용하여 신속하게 이러한 변수를 선언 할 때의 차이점은 무엇입니까? 또는 ()

분류에서Dev

변수의 값을 반환하는 선언에 대한 기술적 제한은 무엇입니까?

분류에서Dev

파이썬에서 변수를 선언하는이 두 가지 방법의 차이점은 무엇입니까?

분류에서Dev

XML 변수 대신 열의 셀에 .nodes ()를 적용하는 방법은 무엇입니까?

분류에서Dev

Canonical은 Unity의 차세대를 위해 GTK 대신 QT를 선택하는 이유는 무엇입니까?

분류에서Dev

확장 인터페이스에서 멤버를 선언하는 것과 구현에서 선언하는 것의 차이점은 무엇입니까?

분류에서Dev

static final을 사용하는 대신 String과 같은 불변 객체의 실제 이점은 무엇입니까?

분류에서Dev

ManyToManyField 대신 ForeignKey의 장단점은 무엇입니까?

분류에서Dev

React의 useRef에서 입력 필드를 재설정하는 방법은 무엇입니까?

분류에서Dev

ISP DNS 서버 대신 대체 DNS를 사용할 때의 장단점은 무엇입니까?

분류에서Dev

'C'의 함수 내에서 전역 변수를 선언하는 방법은 무엇입니까?

분류에서Dev

클래스의 객체에 대한 포인터 벡터를 선언하는 방법은 무엇입니까?

분류에서Dev

C 부동 소수점에서 중단하는 대신 NaN의 목적은 무엇입니까?

분류에서Dev

혼합 변수가없는 함수 호출의 장점은 무엇입니까?

분류에서Dev

상속 된 메서드를 재정의하는 대신 확장하는 방법은 무엇입니까?

분류에서Dev

Outlook의 대화에 대한 회신 처리를 변경하는 방법은 무엇입니까?

분류에서Dev

Outlook의 대화에 대한 회신 처리를 변경하는 방법은 무엇입니까?

분류에서Dev

매번 함수를 사용하는 대신 getElementById ()의 결과를 변수에 저장하는 이유는 무엇입니까?

분류에서Dev

다른 Integer의 값을 기반으로 변수를 선언하는 방법은 무엇입니까?

분류에서Dev

System.Collections.Generic.IEnumerable 형식의 변수를 선언하는 방법은 무엇입니까?

분류에서Dev

Linux 대신 QNX 또는 VxWorks와 같은 RTOS를 사용할 때의 이점은 무엇입니까?

분류에서Dev

예제에서 setter 메서드를 사용하는 것과 단순히 변수를 선언하는 것의 차이점은 무엇입니까?

분류에서Dev

Win32 API에 대한 변수를 선언하는 방법은 무엇입니까?

분류에서Dev

C ++에서 고해상도 클럭에 대한 변수를 선언하는 방법은 무엇입니까?

분류에서Dev

공유 상태에 잠금 대신 클로저를 사용하는 장단점은 무엇입니까?

분류에서Dev

R의 변수 내용 대신 변수 이름을 반환하기 위해 max ()를 얻는 방법은 무엇입니까?

분류에서Dev

Activity에서 최종 변수를 선언하는 것과 onCreate 메서드에서 인스턴스화하는 것의 차이점은 무엇입니까?

분류에서Dev

r의 점에 대수 곡선을 맞추는 방법은 무엇입니까?

Related 관련 기사

  1. 1

    React Hooks-useEffect 외부의 변수 선언으로 요소 자식 (useRef 사용)을 대상으로 지정하는 방법은 무엇입니까?

  2. 2

    !를 사용하여 신속하게 이러한 변수를 선언 할 때의 차이점은 무엇입니까? 또는 ()

  3. 3

    변수의 값을 반환하는 선언에 대한 기술적 제한은 무엇입니까?

  4. 4

    파이썬에서 변수를 선언하는이 두 가지 방법의 차이점은 무엇입니까?

  5. 5

    XML 변수 대신 열의 셀에 .nodes ()를 적용하는 방법은 무엇입니까?

  6. 6

    Canonical은 Unity의 차세대를 위해 GTK 대신 QT를 선택하는 이유는 무엇입니까?

  7. 7

    확장 인터페이스에서 멤버를 선언하는 것과 구현에서 선언하는 것의 차이점은 무엇입니까?

  8. 8

    static final을 사용하는 대신 String과 같은 불변 객체의 실제 이점은 무엇입니까?

  9. 9

    ManyToManyField 대신 ForeignKey의 장단점은 무엇입니까?

  10. 10

    React의 useRef에서 입력 필드를 재설정하는 방법은 무엇입니까?

  11. 11

    ISP DNS 서버 대신 대체 DNS를 사용할 때의 장단점은 무엇입니까?

  12. 12

    'C'의 함수 내에서 전역 변수를 선언하는 방법은 무엇입니까?

  13. 13

    클래스의 객체에 대한 포인터 벡터를 선언하는 방법은 무엇입니까?

  14. 14

    C 부동 소수점에서 중단하는 대신 NaN의 목적은 무엇입니까?

  15. 15

    혼합 변수가없는 함수 호출의 장점은 무엇입니까?

  16. 16

    상속 된 메서드를 재정의하는 대신 확장하는 방법은 무엇입니까?

  17. 17

    Outlook의 대화에 대한 회신 처리를 변경하는 방법은 무엇입니까?

  18. 18

    Outlook의 대화에 대한 회신 처리를 변경하는 방법은 무엇입니까?

  19. 19

    매번 함수를 사용하는 대신 getElementById ()의 결과를 변수에 저장하는 이유는 무엇입니까?

  20. 20

    다른 Integer의 값을 기반으로 변수를 선언하는 방법은 무엇입니까?

  21. 21

    System.Collections.Generic.IEnumerable 형식의 변수를 선언하는 방법은 무엇입니까?

  22. 22

    Linux 대신 QNX 또는 VxWorks와 같은 RTOS를 사용할 때의 이점은 무엇입니까?

  23. 23

    예제에서 setter 메서드를 사용하는 것과 단순히 변수를 선언하는 것의 차이점은 무엇입니까?

  24. 24

    Win32 API에 대한 변수를 선언하는 방법은 무엇입니까?

  25. 25

    C ++에서 고해상도 클럭에 대한 변수를 선언하는 방법은 무엇입니까?

  26. 26

    공유 상태에 잠금 대신 클로저를 사용하는 장단점은 무엇입니까?

  27. 27

    R의 변수 내용 대신 변수 이름을 반환하기 위해 max ()를 얻는 방법은 무엇입니까?

  28. 28

    Activity에서 최종 변수를 선언하는 것과 onCreate 메서드에서 인스턴스화하는 것의 차이점은 무엇입니까?

  29. 29

    r의 점에 대수 곡선을 맞추는 방법은 무엇입니까?

뜨겁다태그

보관