javascript - 映射 react Hook 后如何从api发送值

Question

我正在使用 React 钩子(Hook)，我试图将值发送到函数 delete 并执行函数 put

           <Fab aria-label="delete"
                      className={classes.fab}
                      value={vacation.id}
                      key={vacation.id}
                      onChange={setDeleteid(vacation.id)}
                      onClick={DeleteCard}>
                      <DeleteIcon />
                    </Fab>

这是函数

  const DeleteCard = (e) => {
e.preventDefault();

console.log('delete' + deleteid);
alert(deleteid)
const confirm = window.confirm(`You are sure you want to delete vacation number ?`);
if (confirm == true) {
await axios.delete(`http://localhost:4000/users/admin/delete/:${e}`)
} else {
  alert("You pressed Cancel!")
}

这是我的状态

     //vacation
  const [vacation, setVacation] = useState([]);
  const [deleteid, setDeleteid] = useState();
  //putcard
  const [description, setDescription] = useState("");
  const [destination, setDestination] = useState("");
  const [fromDate, setFromDate] = useState("");
  const [toDate, setToDate] = useState("");
  const [price, setPrice] = useState("");

显然我试图发送给状态的 id 没有进来，因为它记录了我 undifind

---

更新

这是我的状态

const [deleteid, setDeleteid] = useState('');

我想在这里发送，它给我未定义

  onChange={() => setDeleteid(value)}

Answer 1

这是因为您在 DOM 呈现时执行函数(它运行该函数一次)。要解决此问题，请将您的 onChange 事件更改为调用您的函数的箭头函数，如下所示:

onChange={() => setDeleteid(vacation.id)}

这应该可以解决问题，编码愉快!