728x90
export default function App(){
function handleEvent(e){
console.log("handleEvent Click");
e.preventDefault();
}
function parent(e){
console.log("parent: " + e);
}
function child(e){
console.log("child: " + e);
e.stopPropagation(); //부모의 버블링 방지
}
return(
<>
<form onSubmit={handleEvent} action="target.html">
<button>submit</button>
</form>
<hr></hr>
<div onClick={parent} style={{backgroundColor: "yellow"}}>
parent
<div onClick={child} style={{backgroundColor: "red"}}>child</div>
</div>
</>
)
}
'단순 코드 기록 > React' 카테고리의 다른 글
React_버튼 이벤트에 따라 상태 변경 (0) | 2024.03.14 |
---|---|
React_실시간 랜더링 (0) | 2024.03.14 |
React_버튼 계층구조 이벤트 처리 (0) | 2024.03.14 |
React_버튼 이벤트 처리 (0) | 2024.03.14 |
React_자식에서 데이터 변경 (0) | 2024.03.13 |