[React] 이벤트 버블링, state 변경 함수의 우선순위

이벤트 버블링이란?

<h1>
	제목1
    <h2>
    	제목2
        <span onClick()={....}> 누르세요 </sapn>
    </h2>
</h1>

• span 태그뿐만 아닌 h1, h2 태그를 눌러도 onCLick 이벤트가 작동하는 현상.
• 이벤트 버블링이라고 하여 하위 html 이벤트 핸들러가 상위 html 까지 퍼지는 것을 뜻한다.
• 그것을 막고 싶다면 

onClick(e) e.stopPropagation()

• onClick 내부에 파라미터와 함수로 해당 내용을 추가해준다.

 

 

state 변경

• state 내용을 변경하는 함수는 느리다.

const [title, chageTitle] = useState([1,2,3])

• 해당 코드를 만들고 

ChageTitle(...title, test)
console.log(test)

• 해당 문법을 작동하면 console.log 가 먼저 작동하는 형식을 알 수 있다.
• 그에 대한 이유는 chageTitle이 비동기 함수이기 때문이다.