React onClick - pass event with parameter

Question

Without Parameter

function clickMe(e){
  //e is the event
}

With Para

Answer 1

To solve the creating new callback issue completely, utilize the data-* attributes in HTML5 is the best solution IMO. Since in the end of the day, even if you extract a sub-component to pass the parameters, it still creates new functions.

For example,

const handleBtnClick = e => {
  const { id } = JSON.parse(e.target.dataset.onclickparam);
  // ...
};

See https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes for using data-* attributes.