[React.js] 이벤트

2024. 6. 6. 09:00React.js

728x90

 

이벤트 핸들러

 → 이벤트를 만드는 함수

 

 

리액트만의 이벤트 큰 특징

 

synthetic event

→ 합성이벤트라는 뜻

    브라우저마다 제공하는 이름이나 이벤트, 폰트 등등 다름

    그래서 실제로 개발할 때 기본 브라우저 말고 다른 브라우저에서 실행했을 때 문제가 발생

    우리는 이를 크로스브라우징 이슈라고 함 

 

synthetic event는 모든 브라우저의 이벤트 객체를 하나로 통일한 형태로 크로승브라우징 이슈를 방지해 준다

 

 

 

 

이벤트함수 이용하기

 

 1. 태그에 이벤트 이름 = {() => { 이벤트 내용;}}

 

      

    <button onClick={() => {
        console.log("hi");
      }}
    </button>

 

 

 2.  이벤트를 변수에 주고  태그에 이벤트 이름 = {변수이름}

 

      const clickEvent = () => {
        console.log("hi");
      }}

 

    <button onClick={clickEvent} </button>

728x90

'React.js' 카테고리의 다른 글

[React.js] State와 Props  (0) 2024.06.08
[React.js] State  (0) 2024.06.07
[React.js] Props  (0) 2024.06.05
[React.js] JSX에서 스타일 주기  (0) 2024.06.04
[React.js] JSX  (0) 2024.06.03