onClick 이벤트에 인자를 주고싶을 때

문제점

const onClickLenUp: any = useCallback((e: any, idx: number) => {
  console.log("누름", idx);
}, []);

이렇게해서

<button onClick={onClickLenUp(item[index]?.id)}>

html에 바로 주게되면 버튼을 클릭하지도 않았는데 실행이되어있다.

 

해결법

해결방법은 익명 함수를 사용하는 것이다.

<button onClick={() => onClickLenUp(item[index]?.id)}>

이렇게 익명 함수를 사용하게 되면 onClick 이벤트에 인자를 줄 수 있다!