how to create a delete button in react code example
Example: delete button react
Let me guess, Are you looking for something like this?
class Example extends React.Component {
constructor(){
this.state = {
data: [
{id:1, name: 'Hello'},
{id:2, name: 'World'},
{id:3, name: 'How'},
{id:4, name: 'Are'},
{id:5, name: 'You'},
{id:6, name: '?'}
]
}
}
delete(item){
const data = this.state.data.filter(i => i.id !== item.id)
this.setState({data})
}
render(){
const listItem = this.state.data.map((item)=>{
return <div key={item.id}>
<span>{item.name}</span> <button onClick={this.delete.bind(this, item)}>Delete</button>
</div>
})
return <div>
{listItem}
</div>
}
}
React.render(<Example />, document.getElementById('container'));
In this example pay attention how i'm binding delete method and pass there new parameter. fiddle
I hope it will help you.
Thanks