React question - Cannot make handleDelete function work

React question - Cannot make handleDelete function work
0

#1

Hello all,

I’m working on learning React and so I took the NetNinja React course. Now, I am trying to rebuild the To Do List application using only a single component. I’ve got all of the functionality working the way that I want, except I cannot delete items from the list.

I have a handleDelete function in the code that is activated onClick of the ‘x’ but I’m not sure how to make it delete that item.

The link is:

Here

Any help or insight would be much appreciated.


#2

Add .bind(this, index) to onClick handler:

<span className="item-delete" onClick={this.handleDelete.bind(this, index)}> x </span>

handleDelete:

  handleDelete: function(todo) {
    let todos = this.state.todos;
    todos.splice(todo, 1);
    this.setState({todos});
  },

#3

Awesome! Thank you so much.

The concept of binding is so confusing to me. I’ll have to study that a bit more to understand how/when to use it. Thank you for your help on this, much appreciated!