Pass multiple parameters to onClick function

Function parameters are the names listed in the function's definition. Function arguments are the real values passed to the function. Parameters are initialized to the values of the arguments supplied.

If parameter is function (clickHandler in this case), pass argument as function => clickHandler();

import Button from './btn';

import { useNavigate } from 'react-router-dom';

export default function BtnNav(footer, btnText, btnLink, clickHandler) {

const navigate = useNavigate();

return (

<ul className={`${footer}__nav`}>

{btnText.map((el, index) => (

<li key={`${footer}-k-${index}`}>

<Button

id={`${footer}-btn-${index}`}

className={`${footer}-btn-${index}`}

onClick={() => {

navigate(btnLink[index]);

clickHandler();

}}

content={el}

/>

</li>

))}

</ul>

);

}

// to avoid message error clickHandler, pass empty function as onClick in necessary components

const falseClick = () => {};

https://blog.openreplay.com/3-ways-of-passing-multiple-parameters-to-the-onclick-handler-in-react

https://stackoverflow.com/questions/26069238/call-multiple-functions-onclick-reactjs