useRef의 기초

useRef 후크는 기본 html 입력과 구성 요소의 논리 사이의 연결을 설정하는 데 사용됩니다.

이 연결은 예를 들어 입력 값과 같은 입력 속성에 대한 액세스를 제공합니다.

다음 예제에서는 값을 가져오고 상태를 설정하기 위해 useRef를 사용하고 있습니다.

import React, { useState, useEffect, useReducer, useMemo, useRef } from "react";

const Cryptos = () => {
    const searchInput = useRef(null);
    const [search, setSearch] = useState("");

    const handleSearch = () => setSearch(searchInput.current.value);

    return (
        <div>
            <input
                ref={searchInput}            
                type="text" 
                value={search} 
                onChange={handleSearch} 
            />
        </div>
    );
};
export default Cryptos;