I have a main App component that includes this...
changeAmount(a) {
console.log('changing: ', a);
}
<Table
data={result}
onClick={() => this.changeAmount()}
/>
The <Table> component then has a <TableRow> component which has two buttons within it. Is there a way to pass multiple onClick methods so I can use one for decrease and one for increase ?
export default class TableRow extends Component {
render() {
const {row, onClick} = this.props;
return (
<tbody>
<tr>
.....
<span>
<button
className="btn btn-outline-primary btn-sm minusBtn"
onClick={onClick}
>
-
</button>
.....
</tr>
</tbody>
)
}
}
Edit: Tried using one handler with a parameter:
App component:
<Table
data={result}
onClick={(type) => this.changeAmount(type)}
/>
Table component:
{
data.map(row => (
<TableRow key={row._id} row={row} onClick={onClick}/>
))
}
TableRow component:
<button
className="btn btn-outline-primary btn-sm minusBtn"
onClick={this.props.onClick('decrease')}
>