2

In the following code, I have two functions in the onClick of a div: () => this.delete(this, this.state.id) and this.props.deleteTodo.bind(this, this.state.id). However, when I put both of them in at the same time, only one of them works.

If I limit it to one of them, it works fine, but why doesn't it work when I add both?

<div onClick={() => this.delete(this, this.state.id), this.props.deleteTodo.bind(this, this.state.id)}>button</div>
space_pok
  • 179
  • 11

2 Answers2

5

You need to wrap them in curly braces and you should end lines with semi colons and not commas:

<div onClick={() => { 
    this.delete(this, this.state.id);
    this.props.deleteTodo.bind(this, this.state.id); 
}}>button</div>
simon
  • 1,095
  • 6
  • 11
  • Thanks for the answer. I tried that method before, but it only executes `this.delete(this, this.state.id);`. – space_pok Apr 01 '21 at 17:10
  • Then something else is wrong. Here's an example that illustrates that both functions run https://codesandbox.io/s/react-playground-forked-2xqxq?file=/index.js – simon Apr 01 '21 at 17:26
0

For better readability and to avoid errors such as syntax errors, combine them both in a single function and call that function or as simnys answer.

Gark
  • 35
  • 9