이번 리액트 숙련 강의를 들으며
이번에 만들었던 투두리스트를 되짚어봤어.
useEffect, useRef
useEffect
- 로딩시에 콜백으로 안의 실행문을 한 번 만 딱 실행되게 해주는 함수야.
useRef
- 값을 Dom에 저장해서 렌더링해도 값을 유지하게 해주는 저장소 역할도 하고
- Dom에 직접 접근해서 값을 직접 DOM제어도 할 수 있어서
두 함수를 이용하자면
useEffect(() => {
refComment.current.focus();
},[])
const refTitle = useRef(null);
const 함수 = () => {
refTitle.current.focus();
}
<value ref={refTitle} />
이런 식으로 useEffect론 로딩하자마자 해당 input에 포커스 줄 수 있고,
함수실행되고 마지막에 해당 인풋에 포커스가게 할 수 있고
value 값을 저장도 할 수 있어.
느낀점
-
'개발일지' 카테고리의 다른 글
[TIL] 24_0126 리액트에서의 map사용, key prop 오류 (0) | 2024.01.26 |
---|---|
[TIL] 두 번째 개인 프로젝트 피드백 반영, 베이직 과제 후 (0) | 2024.01.25 |
[TIL] 23_0122 이름 짓기, 비구조화 할당(객체 구조분해, 배열 구조분해) (2) | 2024.01.22 |
[TIL] 24_0121 컴퓨팅 사고, 개발 공부법 (0) | 2024.01.21 |
[TIL] 24_0120 Javascript 오류 - SyntaxError(구문 오류, 문법 오류) (0) | 2024.01.20 |