delete button react

1Let me guess, Are you looking for something like this?
2
3class Example extends React.Component {
4    constructor(){
5    this.state = {
6      data: [
7        {id:1, name: 'Hello'},
8        {id:2, name: 'World'},
9        {id:3, name: 'How'},
10        {id:4, name: 'Are'},
11        {id:5, name: 'You'},
12        {id:6, name: '?'}
13      ]
14    }
15  }
16
17  // shorter & readable 
18  delete(item){
19    const data = this.state.data.filter(i => i.id !== item.id)
20    this.setState({data})
21  }
22
23  // or this way, it works as well
24  //delete(item){
25  //  const newState = this.state.data.slice();
26  //    if (newState.indexOf(item) > -1) {
27  //    newState.splice(newState.indexOf(item), 1);
28  //    this.setState({data: newState})
29  //  }
30  //}
31
32  render(){
33    const listItem = this.state.data.map((item)=>{
34        return <div key={item.id}>
35        <span>{item.name}</span> <button onClick={this.delete.bind(this, item)}>Delete</button>
36      </div>
37    })
38    return <div>
39        {listItem}
40    </div>
41  }
42}
43
44React.render(<Example />, document.getElementById('container'));
45In this example pay attention how i'm binding delete method and pass there new parameter. fiddle
46
47I hope it will help you.
48
49Thanks