I would like to know how to make this button functional, let's say, I created a table with a repeater that shows me all the categories that the api returns in json, but in each I have the delete option, to delete that category, how can I do it in react What, for example, with an onClick or something like that, call a function and send it the name of that category and then have the function do a fetch to my API?
{this.state.items.length ?
this.state.items.map(item=>
<tr>
<td>{item.name}</td>
<td><a href="#"><b>Edit</b></a> | <a className="red" href="#">Delete</a></td>
</tr>
You can pass the id of the category directly to the method in charge of removing the category:
You can also do it like this:
And when the button is clicked,
id
the category property is passed to the method and here it is sent to the API for deletion:After removing the category from the database, we are left with removing it from the table. For this you can filter the categories you have in
state
so that you only get the categories whose id is different from the id of the deleted category:What will happen is that the table will be re-rendered and the deleted record will no longer appear.