url 中的参数未定义 - axios，反应，表达

Question

I'm trying to delete some data from a mysql database with the code:

app.delete("/api/deleteHomework/:homeworkName", (req, res) => {
    const homeworkName = req.params.homeworkName

    connection.query(
            "DELETE FROM homework WHERE name = ?",
            [homeworkName],
            (err, result) => {
                if(result){
                    res.send({ message: result })
                    console.log(result)
                }
                if(err){
                    console.log(err)
                }
            }
    )
})

and then the homeworkName is passed from the front end with the code:

  const deleteHw = (homework) => {
        Axios.delete(`http://localhost:1337/api/deleteHomework/${homework}`)
        .then((response) => {
            if(response){
                console.log(response)
            } else{
                console.log("error")
            }
        })
    }

<DeleteForeverIcon className={classes.deleteHwIcon} onClick={() => {deleteHw(value.homeworkName)}} />

However it says the params in the url is undefined: url: "http://localhost:1337/api/deleteHomework/undefined"

Answer 1

Pass the props "value" directly in the delete function

export default function YourComponent({ value }) {
...

const deleteHw = () => {
  Axios.delete(`http://localhost:1337/api/deleteHomework/${value.homeworkName}`) // here
  .then((response) => {
    if(response){
      console.log(response)
    } else{
      console.log("error")
    }
  })
}
    
<DeleteForeverIcon className={classes.deleteHwIcon} onClick={deleteHw} />

Back side

app.delete('/api/deleteHomework/:homeworkName', (req, res) => {
  connection.query(`DELETE FROM homework WHERE name=${req.params.homeworkName}`, (err, result) => {
    if (err) {
      console.log(err);
    } else {
      res.json(result);
    }
  });
});