잘못된 구현
function handleClick(){
console.log('click');
}
<li>
<button onClick={handleClick()}>{children}</button>
</li>
-> 잘못된 구현인 이유 : handleClick()은 이 코드 라인이 실행될 때 이 함수가 바로 실행됨. (화면이 렌더링 될때)
올바른 구현
<li>
<button onClick={handleClick}>{children}</button>
</li>
-> 단순히 함수 이름을 사용 > onClick값으로서의 함수를 전달 > 리액트에 의해 시스템뒤에서 실행됨
'React' 카테고리의 다른 글
[React] proxy props 사용하기 (0) | 2024.04.02 |
---|---|
[React] key prop의 중요성 (1) | 2024.03.29 |
[React] useState() (1) | 2024.03.29 |
[React] 컴포넌트, index.html, index.jsx, jsx 특징, React 실행방식 (0) | 2024.03.28 |
[React] React에 대한 짧은 개요 (0) | 2024.03.27 |