emayom.log

  • 방명록

.current.focus() 1

[React] #8 리액트로 input 포커스 주기 : React.useRef()

input 태그를 작성하고 해당 태그에 포커스를 주고싶을 때! html 태그에 autofocus를 명시하거나, 자바스크립트에서는 selector 함수를 통해 가져온 엘리먼트에 focus() 메소드를 통해 포커스를 줄 수 있다. 그렇다면 리액트는 ???? 🤔 우선 자바스크립트부터 확인해보자. 그냥주면 심심하니까 화면이 보여지고 3초 뒤부터 포커스를 줘보자. 우선 DOM 셀렉터로 input을 가져오고, setTimeout()으로 3초 뒤에 focus()를 주도록 작성할 것이다. const autoFocusInput = document.getElementById("input"); setTimeout(() => { autoFocusInput.focus(); }, 3000); 이제 리액트로 바꿔보자. 이전과 동일..

JS/React 2021.09.02
이전
1
다음
더보기
프로필사진

emayom.log

습관의 고리는 인식할 수 없을 정도로 너무 약해 보인다. 그러다가 끊어버릴 수 없을 정도로 막강해진다.

  • 분류 전체보기 (114)
    • HTML (2)
    • CSS (10)
      • SCSS (0)
      • CSS3 (0)
    • JS (32)
      • [Udemy] 클린코드 자바스크립트 (0)
      • Javascript (14)
      • React (12)
    • Programmers (46)
      • Algorithm, Data Structure (3)
      • Level 1 (36)
      • Level 2 (7)
    • FE interview (5)
    • etc. (16)
      • git (4)

Tag

레벨 1, 코딩테스트, input, 자바스크립트, level 1, html, level1, programmers, JS, 함수 선언식, 프로그래머스, css, Jeklly, 프론트앤드, React, 컴포넌트, 리액트, 코테, javascript, 기술면접,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

«   2025/06   »
일 월 화 수 목 금 토
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30

방문자수Total

  • Today :
  • Yesterday :

Copyright © Kakao Corp. All rights reserved.

티스토리툴바