목록dom 조작 (1)

3은로그

React 기본 - 간단한 일기장 프로젝트 2 (useRef)

목표 DOM 요소에 접근할 수 있는 useRef를 이용해서 정상적으로 입력되지 않았다면 강제적으로 focus 하는 기능 구현 ● 작성자가 1글자 이하이면 작성자 입력창 focus ● 내용 부분이 5글자 이하이면 내용 입력창 focus 기능구현 useRef를 사용해서 이 기능을 구현할 수 있다. 1. 먼저 import 한다. 2. useRef를 호출해서 반환값을 authorInput, contentInput 상수에 담는다. authorInput, contentInput 상수에는 React.MutableRefObject가 저장된다. MutableRefObject는 HTML DOM 요소에 접근할 수 있도록 해준다. 3. input 태그와 textarea 태그에 각각 ref = {authorInput}, ref..
React 2023. 2. 10. 03:14
이전 Prev 1 Next 다음