코드메모장

    useEffect 2

    [React] cleanUp Function 을 이용한 디바운싱 기능

    만약 ip 또는 pw 의 input 에 타이핑을할때마다 api 호출을 해야되는 상황이라면 input 에 onChange 될때마다 api 호출하는것이 아닌 어느정도 타이핑을 기다린후 사용자가 타이핑을 멈췄을때 api 를 호출하는것이 디바운싱 기능이다. 디바운싱의 의미는 디바운싱(Debouncing) : 연이어 발생한 이벤트를 하나의 그룹으로 묶어서 처리하는 방식으로, 주로 그룹에서 마지막, 혹은 처음에 처리된 함수를 처리하는 방식으로 사용되곤 한다. 아래는 로그인을 할때 디바운싱을 통한 간단한 id,pw 의 검증 예제이다. email 과 password 가 바뀔때마다 useEffect가 실행되는데 setTimeout 을 주어서 0.5초 안에 useEffect가 실행되면 cleanUp 시켜버린다. 디바운싱과..

    React.js 2023.03.08

    [React] React Hook

    useState state 를 바꾸는 훅 useEffect 라이프사이클 훅을 대체할수있다 compoenetDidMount : dom 에 랜더가 완료된시점 compoenetDidUpdate : 컴포넌트가 업데이트 되고 난후의 시점 compoenetWillUnmount : 컴포넌트가 삭제되는 시점 라이프사이클 참조 https://www.zerocho.com/category/React/post/579b5ec26958781500ed9955 https://www.zerocho.com/category/React/post/579b5ec26958781500ed9955 www.zerocho.com useReducer useState 의 확장판 참조 : https://goddaehee.tistory.com/311 [Rea..

    React.js 2023.01.18
    이전
    1
    다음
    더보기
    프로필사진

    • 분류 전체보기 (65)
      • Vue.js (10)
      • Nuxt.js (1)
      • React.js (16)
      • Javascript (11)
      • TypeScript (6)
      • Python (2)
      • ETC (13)
      • Vite (1)
      • Next.js (2)

    Tag

    symbol, useEffect, CSS, ES6, RTK, REACT, router, Redux, 프론트엔드, Next, 파이썬, vue.js, vue, Javscript, JavaScript, nextJS, map, Python, Type, typeScript,

    최근글과 인기글

    • 최근글
    • 인기글

    최근댓글

    공지사항

    페이스북 트위터 플러그인

    • 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.

    티스토리툴바