OnDoubleClick in react

Question

I can't get it to respond onDoubleClick. neither with console.log. I do not understand why, since the code looks good. I hope your help thank you very much, bye.

}

deleteUser = async(id) => {

    await axios.delete('http://localhost:4000/users/' + id)
    this.getUsers();

}

                           this.state.users.map(user => (
                            <li 
                                className="list-group-item list-group-item-action" 
                                key={user._id}
                                onDoubleClick={() => this.deleteUser(user._id)}
                                >
                                {user.username}
                            </li>)
                        )

Can you create a working code snippet where this doesn't work? [This answer](https://meta.stackoverflow.com/questions/338537/how-do-i-create-a-react-stack-snippet-with-jsx-support) can help with it — Anurag Srivastava, Jul 04 '20 at 18:17

score 0 · Answer 1 · answered Jul 04 '20 at 18:43

0

Here you need to bind your method before using in template

this.doublemethod = this.doublemethod.bind(this); // in your constructor

Note: https://stackblitz.com/edit/react-juq9t6

answered Jul 04 '20 at 18:43

Arunkumar Ramasamy

751
4
8

GMKHussain · Answer 2 · 2020-07-04T18:15:33.493

-1

Add .bind(this) hope you achieve what you want.

 <li className="list-group-item list-group-item-action" 
      key={user._id}
      onDoubleClick={ this.deleteUser(user._id).bind(this)}>
      {user.username}
 </li>

edited Jul 04 '20 at 18:15

answered Jul 04 '20 at 18:11

GMKHussain

3,342
1
21
19

Not needed with arrow functions – Anurag Srivastava Jul 04 '20 at 18:13

OnDoubleClick in react

2 Answers2