React useRef 후크 간단한 예제
useRef 후크 반응
useRef 후크는 렌더링 간에 값을 유지하는 데 사용됩니다.
업데이트 시 다시 렌더링하지 않으며 변경 가능한 값을 저장하는 데 사용할 수 있으며 DOM 요소에 직접 액세스하는 데에도 사용됩니다.
아래는 상태(이름)의 이전 값을 변경한 후 유지하는 useRef의 예입니다.
import React, { useState, useEffect, useRef } from 'react';
export default function App(){
const [name, setName] = useState('')
const prevName = useRef()
useEffect(()=> {
prevName.current = name
},[name])
return (
<>
<input value={name} onChange={e => setName(e.target.value)}/>
<div> My name is {name} and it used to be {prevName.current}</div>
<>
)
}
참조:
Reference
이 문제에 관하여(React useRef 후크 간단한 예제), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/byusa/react-useref-hook-simple-example-2ca4텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)