useRef

JavaScriptで特定のドームを選択する場合、getElementById、querySelectorなどのDom Selector関数を使用してドームを選択します.
反応器でもドームを直接選択する場合があります.このときrefを使用します.
関数型refはuserefというhook関数を使用します.クラス構成部品はコールバック関数を使用することも、コールバック関数を使用することもできます.createRefという名前の関数を使用します.
関数の使用

import React, {useRef, useState} from 'react';

function App() {
	const nameInput = useRef();
    return (
        <div className="App">
            <input
                name="user"
                placeholder="이름"
                onChange={onWatch}
                value={user}
                ref={nameInput}
            />
         </div>
    )
}

使用方法は、useref hookを呼び出して「Refオブジェクトの作成」(変数に格納)ドームにref値を設定することです.現在の値に近づくと、希望するドームが表示されます.
クラスの操作

import React from "react";
import logo from "./logo.svg";
// BucketList 컴포넌트를 import 해옵니다.
// import [컴포넌트 명] from [컴포넌트가 있는 파일경로];
import styled from "styled-components";

// 클래스형 컴포넌트는 이렇게 생겼습니다!
class Testing extends React.Component {
    constructor(props) {
        super(props);
        this.text = React.createRef();
    }

    componentDidMount(){
        // 콘솔에서 확인해보자!
        console.log(this.text);
        console.log(this.text.current);
        this.text.current.focus();
    }

    // 랜더 함수 안에 리액트 엘리먼트를 넣어줍니다!
    render() {

        return (
            <div className="App">
                <div>
                    <input type="text" ref={this.text}/>
                </div>
            </div>
        );
    }
}

export default Testing;