handleClick ''TypeError: undefined has no properties'' 找不到未定义的内容

Question

我试图通过单击发送要删除的行的 _id 的按钮来删除后端中的一行，但我得到这个错误指向按钮的行。我不明白这个“未定义”指的是什么，我错过了什么？

  34 | {
  35 | todos && todos.map((todo) => ([
  36 |   <p key={todo._id} >{todo.content}</p>,
> 37 |   <button key={i++}  id="del"  onClick={() => {this.handleClick(todo._id)}}/>
  38 | ]
  39 | ))
  40 | }

我的handleClick如下：

useEffect(() => {
const handleClick = (todo_id) => {
  const delTodo = async () => {
    const del = await Axios.delete('http://localhost:3001/todo/' + todo_id)
    .then(() => {
      console.log('deletado!!')
    })
  }
}
}, [])

Answer 1

使用handleClick而不是this.handleClick。因为功能组件没有this。并且还声明了函数handleClickoutSide useEffectinside 不需要使用

更新

你声明做很多功能。只需删除delTodo 函数并将异步添加到handleClick

 const handleClick = async (todo_id) => {
    const del = await Axios.delete('http://localhost:3001/todo/' + todo_id)
    .then(() => {
      console.log('deletado!!')
    })
 }

<button key={i++}  id="del"  onClick={() => {handleClick(todo._id)}}/>

Answer 2

函数组件不使用this（箭头函数也有这个词的问题，请记住）。只是不要使用this。