728x90
자바스크립트처럼 document.quertSelect로 접근이 불가능하기에 ref로 이름을 달아서 접근을 할 수 있다.
ref(reference)[참조의 줄임말] : DOM에 이름달기
1. class형태에서의 사용방법
1) ref 객체 생성
const 이름 = React.createRef(); 으로 선언
2) DOM 요소 ref 속성으로 지정
<input ref={this.이름} /> 으로 사용(태그안에 적으면됨)
3) DOM요소 접근
this.이름.current / current가 input을 가지고 있음. value값이 사용가능해짐
2. 함수형 컴포넌트에서의 사용방법
1) useRef import
import { useRef } from 'react';
2) ref 객체
const 이름 = useRef();
3) DOM요소 지정
<input ref={이름} /> 클래스가 아니니 this는 붙지 않는다.
4) DOM요소 접근
이름.current
728x90
'프론트앤드 수업' 카테고리의 다른 글
[React] 라이프사이클 실습(useEffect) 의 호출시기 (0) | 2022.06.22 |
---|---|
[React 이론] 라이프 사이클 (0) | 2022.06.22 |
[react] props,state 값 받아오고 사용 (0) | 2022.06.21 |
[React] 기초 (0) | 2022.06.20 |
[javacript] canvas 재귀함수,animation 흐르는 박스 실습 (0) | 2022.06.20 |