[Answered ]-Trying to delete an item from a list of items

1👍

Button callback is immediately invoked upon rendering.

<button onClick={deleteTodo(todo.id)}>delete</button>

Should be called in a callback handler function.

<button onClick={() => deleteTodo(todo.id)}>delete</button>

Or make deleteTodo a curried function so it’s immediately invoked and closes over the passed id value and returns a function to be called when button is clicked.

const deleteTodo = (id) => () => {
  console.log(id);
  fetch(`http://localhost:8000/api/delete/${id}/`, {
    method: "DELETE",
    headers: {
      "Content-Type": "application/json"
    },
  })
};

...

<button onClick={deleteTodo(todo.id)}>delete</button>

Leave a comment