본문 바로가기 메뉴 바로가기

AI Platform / Web

프로필사진
  • 글쓰기
  • 관리
  • 태그
  • 방명록
  • RSS

AI Platform / Web

검색하기 폼
  • 분류 전체보기 (374)
    • 알고리즘 (56)
      • 알고리즘 종류 (20)
      • 백준 (1)
      • sw (30)
    • Web (206)
      • HTML (10)
      • CSS (6)
      • Bootstrap (2)
      • Django (63)
      • JAVASCRIPT (22)
      • typescript (2)
      • Vue.js (10)
      • SQL (2)
      • git (2)
      • 프로젝트구현 (21)
      • React (42)
      • php (2)
      • nodejs (3)
      • nextjs (12)
    • Database (0)
      • MongoDB (0)
    • 빅데이터 (8)
    • 인공지능(Artificial Intelligenc.. (64)
      • python (23)
      • 자연어 처리(natural language pro.. (16)
      • Linear algebra (1)
      • Algorithm (2)
      • Tensorflow (8)
      • speech recongnition (0)
      • 머신러닝 (4)
      • 딥러닝(Deep Learning) (2)
      • CNN (4)
      • RNN (1)
    • 데이터분석 (9)
    • Platform (12)
      • spring boot (9)
    • 라즈베리파이 (5)
    • github (1)
    • 오픈소스 (1)
  • 방명록

REF (1)
[react] ref 기초 정리(스크롤 관리, 포커싱 관리, 반복 DOM)

react로 DOM에 접근하여 스크롤 이벤트, 포커싱 등을 할 수 있는 방법이 바로 ref를 사용하는 방법이다. 기본적인 React에서 부모 자식 컴포넌트의 상호작용은 props로 한다. 그리고 자식을 수정하기 위해서는 props의 값 변경을 통해 수행한다. 수정을 하는 것이 자식 컴포넌트가 아닌 DOM Element나 React Element인 경우도 있을 것이다. 이러한 경우에 ref를 통해 render 되는 html 태그(DOM Node, React Element)에 접근하는 것이 가능하다. 또한, Ref 자체가 단방향 흐름인 React에서 어떠한 오아시스 같은 역할을 하는지도 알아보자. 1. Ref 사용 시기 공식문서는 아래와 같은 시기에 사용을 권장한다. focus 하는 경우 input 태그 선..

Web/React 2023. 2. 20. 21:19
이전 1 다음
이전 다음
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG
  • Python
  • nodejs
  • TensorFlow
  • DFS
  • 클라우데라
  • 자료구조
  • login
  • nextjs autoFocus
  • react autoFocus
  • react
  • django
  • Deque
  • error:0308010C:digital envelope routines::unsupported
  • BFS
  • Vue
  • read_csv
  • useState
  • logout
  • 자연어처리
  • mongoDB
  • JavaScript
  • vuejs
  • useHistory 안됨
  • Express
  • Queue
  • UserCreationForm
  • typescript
  • NextJS
  • pandas
  • next.config.js
more
«   2026/02   »
일 월 화 수 목 금 토
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
글 보관함

Blog is powered by Tistory / Designed by Tistory

티스토리툴바