How to pass parameters without using arrow function in reactjs?

Question

React

Tell me the solution, there is a component in it there is a function, how to correctly pass parameters to it. Judging by the documentation, this option, although working, is not correct, and all the other options that I saw on the network are without passing parameters. I would not like to create many different functions that perform almost identical actions.

class App extends React.Component {
  modal(name,e) {
  	console.log(name,e);
  }

 render() {
  return (
    <button onClick={() => this.modal('auth','show')}>Войти</button>
    )
  }
}

Answer 1

You can pass parameters to functions using bind (this creates a new function, which may affect performance, but I have not encountered any problems).
It might look like this:

...
onChangePeriodClick(period) {
  console.log(period)
}
...
<button onClick={this.onChangePeriodClick.bind(this, 'Hours')} /> Hours </button>
...