REACT 블로그 프젝 230916

혜빈·2023년 9월 16일
0

REACT 보충개념

목록 보기
6/48

< input >에 뭔가 입력시 코드 실행하고 싶으면?

  • onChange / onInput

이벤트 핸들러 종류 몇개 정리

  • < input onMouseOver={}>
    -> input 위에 마우스 올려두면 실행되는 이벤트 핸들러

  • < input onScroll={}>
    -> 스크롤을 하면 실행되는 이벤트 핸들러

-> 이벤트 핸들러들은 상황에 따라 검색해서 쓰면 됨
-> 대신
state만드는 법
props 전송하는 법
컴포넌트 만드는 법
UI 만드는 step 등은 외우고 있어야 함


< input>에 입력한 값 가져오는 법

파라미터에 (e)를 넣고, e.target.value를 통해 input에 입력한 값을 가져온다!

태그를 눌러도 modal창이 뜨는 이유는
상위 html로 퍼지는 이벤트 버블링 현상 때문.
이 현상을 막고 싶다면?

  • e.stopPropagation() 사용하기

array 맨 앞에 자료 넣고싶으면?

  • array.unshift(넣고싶은 자료);

새로 고침하면 다시 돌아감!

array에서 원하는 자료 삭제하고 싶으면?

  • array.splice(삭제하고싶은 자료의 인덱스, 1);

위쪽에 i를 파라미터로 넣어놨기때문에 이렇게 코드짜면 잘 작동함!

class 이용한 컴포넌트 만들기/ state 만들기/ 수정

  • 옛날 문법이라서 알아두기만 하기
profile
최강 개발자를 꿈꾸는 병아리

0개의 댓글