[React] onClick 함수에 매개변수를 사용하는 함수 전달하기

onClick이벤트를 통해 함수에 인자를 넣을 때, onClick 으로 바로 함수를 넘겨주면 안된다

<button onClick={onClickButton(-1)}>-1</button>

화살표 함수를 이용해서 함수를 감싸고 넘겨주어야한다.

<button onClick={()=>{onClickButton(-1)}}>-1</button>

매개변수를 받는 함수는 화살표 함수 로 감싸기
매개변수를 받지 않는 함수는 함수 이름만 써도 ok

// 매개변수를 받지않는 함수였다면
<button onClick={onClickButton}>-1</button>

이유

컴포넌트가 렌더링될 때, 해당 함수가 즉시 실행되기때문에 원하는 이벤트일 때 결과를 얻을 수가 없음

클릭할 때 함수 자체 를 불러와야하는데 함수의 실행값을 전달해주게 됨