Untitled

onBlur = 커서 잃었을 때

onFocus = 포커스 있을 때

eventhandler={handle~~} // 함수만 전달, 매개변수 있으면 event 전달

== eventhandler={() ⇒ handle~~()}

만약에 event 전달했다ㅂ!

event 변수에는 이벤트 들어감

이벤트 일어난 곳은 event.target

value값은 event.target.value

onkeyup 이벤ㅡ

event.key 어떤키 입력된건지 확인가능

조건부 렌더링

<div className={`toggle-circle ${isOn ? "toggle--checked" : ""}`}/>


{isOpen ? 
  <ModalBackdrop>
    <ModalView>
      <ModalCloseBtn onClick={openModalHandler}>X</ModalCloseBtn>
      <div>HELLO CODESTATES</div>
    </ModalView>
  </ModalBackdrop>
: null}
JavaScript
복사

useRef

더 찾아봐야할듯

리스트 map 사용해 출력

<TabMenu>
  {menuArr.map((el, idx) => <li key={idx} className={`submenu${currentTab === idx ? ' focused' : ''}`} onClick={() => selectMenuHandler(idx)}>{el.name}</li>
  )}
</TabMenu>
JavaScript
복사